css的预编译处理语言
- 实现方式
- Less基于JavaScript ，在客户端处理
- Sass是基于Ruby ， 在服务端处理
- 变量
- Less用@
- Sass用$
- 特性
- 变量，作用域，嵌套，继承，运算，颜色函数
- Sass的继承是把一个选择器的所有样式继承到另个选择器， @extend .block;/继承.block选择器下所有样式/
- 将Mixins中的样式嵌套到每个选择器里面。这种方法的缺点就是在每个选择器中会有重复的样式产生。 .block;/继承.block选择器下所有样式/
sass
- 注释：分为三种：
/* */css中显示，//css中不显示，/*重要注释!*/压缩不会被删掉。 - 变量：$+变量名+：+变量值
- 默认变量：变量值后加上 !default , 用来设置默认值
- 全局和局部变量：局部变量值后加上 !global 关键词可以使得局部变量变成全局变量
- 变量嵌套引用：即字符串插值，需要使用 #{} 来进行包裹
- 嵌套：嵌套时候可以使用 & 来引用父元素
- 继承： @extend
- 占位符：使用% 声明的代码块，如果不被@extend调用的话就不会被编译
- 重复代码块：使用混合@mixin命令定义，以及使用@include调用该mixin