sass常见的基本数据类型+加减乘除基本运算

number类型

 

 

编译后

 

 

color类型：

 

 

编译后

 

 

string类型

 

 

编译后

 

 

list数组类型

nth(list, num) 获取list数组中的下标为num的元素

注意num下标是从1开始的

 

 

编译后

 

 

index(list, str) 返回str在list数组中的下标

 

 

编译后

 

 

map 数组类型（有点类似js中的对象）

map-get(map, key) 获取指定key对应的属性值

@each $key,$value in map{ } 遍历map数组

 

 

sass加减乘除基本运算

 

 

编译后

 

 

除法常见问题：

这种写法无法正常计算

 

 

编译后：

 

 

正确写法：

运算用圆括号括起来

在乘法和除法中，多个数值只要写一个单位即可

 

 

编译后

 

 

通过变量方式运算可以不加括号

 

 

编译后

 

 

混合运算：

 

 

编译后

 

 

颜色运算：

mix() 混合色

red() 取红色值

rgb() 拼接成rgb色

 

 

编译后

 

 

字符串运算：

字符串拼接 加号

 

混合宏 mixin

一般mixin（简单）

 

 

编译后

 

 

嵌套mixin

 

 

编译后

 

 

参数mixin

 

 

编译后

 

原文链接:https://www.cnblogs.com/chenyingying0/p/12592091.html
如有疑问请与原作者联系

标签：

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有