sas逻辑回归结果解读(SASS 运算 (Operations)符的基本使用)
sass 运算符虽然没有像那些编程语言那么强大 ,但为了更灵活的输出css ,也增强了一些运算符的功能 ,例如赋值运算符 、等号操作符 、比较运算符 、逻辑运算符 、字符串运算符...等等 ,接下来就来详细介绍下这些运算符的基本使用
赋值运算符
赋值运算符就是把一个值赋值给一个变量 ,通过冒号(:)的方式进行承接(很多编程语言是=) ,例如:
$font-size:16px;也可以把一个变量赋值给另一个变量
$font-size:16px; $h3:$font-size;赋值的变量必须先有值
等号操作符
等号操作符用于比较两个表达式的值是否相等 ,所有数据类型都支持等号运算符:
符号 说明 == 等于 != 不等于例1:数字比较:
$theme:1; .container { @if $theme==1 { background-color: red; } @else { background-color: blue; } }例2:字符串比较:
$theme:"blue"; .container { @if $theme !="blue" { background-color: red; } @else { background-color: blue; } }所有数据类型均支持相等运算 == 或 != ,此外 ,每种数据类型也有其各自支持的运算方式 。
比较运算符
比较运算符主要用于两个数值(整数与小数)间的比较 ,操作符有
符号 说明 < (lt) 小于 > (gt) 大于 <= (lte) 小于等于 >= (gte) 大于等于例如
$theme:3; .container { @if $theme >= 5 { background-color: red; } @else { background-color: blue; } }其它语言还有字符串的比较 ,但这里是不行的
逻辑运算符
逻辑运算符通常用于连接多个表达式 ,用下真判断条件是否成立,它们有and 、or 、not
符号 说明 and 逻辑与 or 逻辑或 not 逻辑非例如
$width:100; $height:200; $last:false; div { @if $width>50 and $height<300 { font-size: 16px; } @else { font-size: 14px; } @if not $last { border-color: red; } @else { border-color: blue; } }数字操作符
数字操作符通常是对数字(整数或小数)进行计算 ,但是某些操作符(/或+)会有特殊情况 ,后面分开详细讲解
符号 说明 + 加 - 减 * 乘 / 除 % 取模例如
/* + 、- 、* 、/ 、% 线数字 、百分号 、css部分单位(px、pt 、in...) + 线数字与百分号或单位运算时会自动转化成相应的百分比与单位值 */ .container { /* ==================+ 运算===================== */ width: 50 + 20; width: 50 + 20%; width: 50% + 20%; width: 10px + 20px; width: 10pt + 20px; width: 10pt + 20; width: 10px + 10; /* ==================- 运算===================== */ height: 50 - 30; height: 10 - 30%; height: 60% - 30%; height: 50px - 20px; height: 50pt - 20px; height: 50pt - 40; /* ==================* 运算===================== */ height: 50 * 30; height: 10 * 30%; /* height: 60% * 30%; 出现了两个百分号*/ /* height: 50px * 20px; 出现了两个单位*/ height: 50 * 2px; height: 50pt * 4; /* ==================/运算 (除完后最多只能保留一种单位)===================== */ $width: 100px; width: 10 / 5; width: 10px / 5px; width: 10px / 10 * 2; width: 20px / 2px * 5%; width: ($width/2); // 使用变量与括号 z-index: round(10)/2; // 使用了函数 height: (500px/2); // 使用了括号 /* ==================% 运算===================== */ width: 10 % 3; width: 50 % 3px; width: 50px % 4px; width: 50px % 7; width: 50% % 7; width: 50% % 9%; width: 50px % 10pt; // 50px % 13.33333px width: 50px % 13.33333px; width: 50px + 10pt; /* width: 50px % 5%; 单位不统一*/ }/ 在 CSS 中通常起到分隔数字的用途,SassScript 作为 CSS 语言的拓展当然也支持这个功能 ,同时也赋予了 / 除法运算的功能 。也就是说 ,如果 / 在 SassScript 中把两个数字分隔 ,编译后的 CSS 文件中也是同样的作用 。
以下三种情况 / 将被视为除法运算符号:
如果值或值的一部分 ,是变量或者函数的返回值 如果值被圆括号包裹 如果值是算数表达式的一部分例如
$width: 1000px; div { font: 16px/30px Arial, Helvetica, sans-serif; // 不运算 width: ($width/2); // 使用变量与括号 z-index: round(10)/2; // 使用了函数 height: (500px/2); // 使用了括号 margin-left: 5px + 8px/2px; // 使用了+表达式 }如果需要使用变量 ,同时又要确保 / 不做除法运算而是完整地编译到 CSS 文件中 ,只需要用 #{} 插值语句将变量包裹 。
字符串运算
+ 可用于连接字符串
注意:如果有引号字符串(位于 + 左侧)连接无引号字符串 ,运算结果是有引号的 ,相反 ,无引号字符串(位于 + 左侧)连接有引号字符串 ,运算结果则没有引号 。
有问题???? 如果有一个值是函数返回的 ,情况可能不一样
例如
.container { content: "Foo " + Bar; font-family: sans- + "serif"; }运行符的基本操作就给大家介绍到这里 ,更多教程请关注“老姚实战营 ” 。
创心域SEO版权声明:以上内容作者已申请原创保护,未经允许不得转载,侵权必究!授权事宜、对本内容有异议或投诉,敬请联系网站管理员,我们将尽快回复您,谢谢合作!