美文网首页
Sass操作符

Sass操作符

作者: 混吃等死小前端 | 来源:发表于2020-02-20 14:58 被阅读0次
  • ==!=检查两个值是否相等。
  • +-*/%对于数字具有通常的数学意义,在科学计算中使用相匹配的单位具有特殊的行为。
  • <<=>>=比较两个数的大小。
  • andornot具有布尔行为。除了falsenull, 其它值Sass都认为是真值。优先级:not > and > or
  • +-/可用于连接字符串。

加法、减法、乘法在运算中有不同类型的单位时,将会报错

进行乘法运算时,两个值单位相同时,只需要为一个数值提供单位即可

.box {
  width:10px * 2px;  
}

“20px*px isn't a valid CSS value.”

//正确写法
.box {
  width: 10px * 2;
}

除法/符号被当作除法运算符时只有以下几种情况:
• 如果数值或它的任意部分是存储在一个变量中或是函数的返回值。width: $width / 10;
• 如果数值被圆括号包围。width: (100px / 2);
• 如果数值是另一个数学表达式的一部分。width: 100px / 2 + 2in;

颜色运算

所有算数运算都支持颜色值,并且是分段运算的

  • color: #010203 + #040506;计算公式为 01 + 04 = 05、02 + 05 = 07 和 03 + 06 = 09, 并且被合成为color: #050709;
  • color: #010203 * 2;计算公式为 01 * 2 = 02、02 * 2 = 04 和 03 * 2 = 06, 并且被合成为color: #020406;

相关文章

  • SASS - 操作符

    SASS – 简介 SASS – 环境搭建 SASS – 使用Sass程序 SASS – SASS – 语法 SA...

  • Sass操作符

    ==和!=检查两个值是否相等。 +、-、*、/、%对于数字具有通常的数学意义,在科学计算中使用相匹配的单位具有特殊...

  • SASS - 简介

    SASS – 简介 SASS – 环境搭建 SASS – 使用Sass程序 SASS – SASS – 语法 SA...

  • SASS - 使用Sass程序

    SASS – 简介 SASS – 环境搭建 SASS – 使用Sass程序 SASS – SASS – 语法 SA...

  • SASS - 环境搭建

    SASS – 简介 SASS – 环境搭建 SASS – 使用Sass程序 SASS – SASS – 语法 SA...

  • SASS- 局部文件(Partial)

    SASS – 简介 SASS – 环境搭建 SASS – 使用Sass程序 SASS – SASS – 语法 SA...

  • SASS - @extend(继承)指令

    SASS – 简介 SASS – 环境搭建 SASS – 使用Sass程序 SASS – SASS – 语法 SA...

  • SASS - 函数

    SASS – 简介 SASS – 环境搭建 SASS – 使用Sass程序 SASS – SASS – 语法 SA...

  • SASS - 输出格式

    SASS – 简介 SASS – 环境搭建 SASS – 使用Sass程序 SASS – SASS – 语法 SA...

  • SASS - 语法

    SASS – 简介 SASS – 环境搭建 SASS – 使用Sass程序 SASS – SASS – 语法 SA...

网友评论

      本文标题:Sass操作符

      本文链接:https://www.haomeiwen.com/subject/znnafhtx.html