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

编译后

猜你喜欢

转载自www.cnblogs.com/chenyingying0/p/12592091.html