-
@import color.css 自动编译成css
@import "color,css" 则不把它编译成css
查看全部 -
此处的颜色值是直接在原有的亮度上+百分比,是简单的加法运算,而不是复杂的百分比计算
例如37%+70%=104%
而不是37%+37%*70%
查看全部 -
相当于数组
$定义一个变量(
key:value
)
可嵌套
查看全部 -
这里的comparable()函数是比较两个函数是否可以进行合并,即加减,而不是java中的比较两个对象的大小
查看全部 -
index(list,item)
找到当前item在list 中的位置,注意索引从1开始而不是0
查看全部 -
把每一个列表的相同项组合,因此每个列表的属性数量必须相同
查看全部 -
join()有两个参数
第一个是排序的列表,最多两个
第二个参数是comma或者space,表示分隔符是,或者空格
查看全部 -
length()中的内容用空格隔开,不能用逗号
查看全部 -
不同单位不能做运算
查看全部 -
#f36等于red(f*f)=255;
green(f*3+3)=51;
blue(f*6+6)=102;
f=16
查看全部 -
To-upper-case() 函数将字符串小写字母转换成大写字母
To-lower-case() 函数将字符串转换成小写字母
查看全部 -
声明map之后必须在结尾加上;,否则无法通过编译
查看全部 -
命令提示符中操作
nth((1px solid #ccc) 20px 5em 6% 3in scaleX(1.5), 6)
输出结果
scaleX(1.5)
查看全部 -
应用:
用户在调用混合宏时,使用unitless()判断用户有没有给参数值加上单位,如果没有,再加入单位。
查看全部 -
在使用 @media 时,还可以使用插件#{}:
$media: screen; $feature: -webkit-min-device-pixel-ratio; $value: 1.5; @media #{$media} and ($feature: $value) { .sidebar { width: 500px; } }
编译出来的 CSS:
@media screen and (-webkit-min-device-pixel-ratio: 1.5) { .sidebar { width: 500px; } }
查看全部
举报