hi，好久不见，之前写过scss的变量、宏、继承、插值、占位、下面来介绍介绍sass的基本特性-运算，自从知道了scss有有着和javascript一样的运算功能，就开始喜欢上了scss/sass。
- 减法
sass：
$width:900px$border-width:200px;.box{widht:$width - $border-width}
css：.box{700px;}注意：两个不同类型单位相减会报错例如 10px+1em
- 乘法
sass：
.box{widht:10px * 2 } //正确.box{widht:10px * 2px} //错误：一个单位不能同时声明两个值
css：
.box{width:20px}
注意：两个不同类型单位相乘会报错例如 10px+1em
- 除法
在sass中接着使用"/"符号做为除号时将不会生效，编译时候既不会得到我们想要的结果也不会报错。
.box{widht:100px/2} //不会报错 编译出来的 css .box{100px/2}
想要编译出正确的css就需要给运算字符的外面添加一个小括号（）；
sass：
.box{widht:(100px/2)}css：
.box{widht:50px}在 Sass 除法运算中，当用变量进行除法运算时，“/”符号也会自动被识别成除法，如下：
sass：
$width: 1000px;$nums:10;.item{width:$wdith / 10}
css:
.item { width: 100px;}
- 变量计算
在sass中除了可以使用数值进行运算还可以使用变量来进行计算，前面有也有用过变量来进行计算，具体看下面的例子：
sass：
$content-widht:100px$border-width:2px;$padding-width:5px;.container{width：$content-widht - $border-width +$padding-width;margin:0 auto;}
css：
.container{width：103px;margin:0 auto;}
- 数字运算
在sass中数字运算是较为常见的（也是我喜欢的一点哈哈），数字运算包括前面介绍的加、减、乘、除等运算，而且还可以通过括号来修改他们的运算优先级，和我们数学运算一样，看到这里是不是感觉很棒（我也是这么想的哈哈）：sass： .box { width: ((220px + 720px) - 11 * 20 ) / 12 ; }css：.box{widht:60px }
- 颜色运算
所有的算数运算都支持颜色值，并且是分段运算的，也就是说红、蓝、绿颜色分段进运算
sass：
.box{color:#010203 + # 020304;}计算公式：01+02=03、02+03=05、03+04=07
css：
.box{color:#030407}算数运算也能将数字和颜色值一起运算同样也是分段运算的看下面例子：
sass：
.box{color:#010203 * 2;}计算公式：01*2=02、02*2=04、03*2=06
css：
.box{color:#020406}
请官方地址：http://sass-lang.com
来源：CSDN
作者：Zangxjun
链接：https://blog.csdn.net/ztj771299799/article/details/51318844