安装Ruby。
再配置环境变量,如:
C:\Ruby23-x64\bin
安装sass:
gem install sass
SCSS 是 Sass 3 引入新的语法,其语法完全兼容 CSS3,并且继承了 Sass 的强大功能。也就是说,任何标准的 CSS3 样式表都是具有相同语义的有效的 SCSS 文件。另外,SCSS 还能识别大部分 CSS hacks(一些 CSS 小技巧)和特定于浏览器的语法,例如:古老的 IE filter 语法。
1、变量
less中的变量@key: value;
sass中的变量$key:value;
特殊变量:如果变量嵌套在字符串中,则需要写在 #{} 符号里面;
多值变量:多值变量分为list类型和map类型,list有点像js对象中的数组,map类型像js中的对象。
list:
//一维数据
$px: 5px 10px 20px 30px;
//二维数据,相当于js中的二维数组
$px: 5px 10px, 20px 30px;
$px: (5px 10px) (20px 30px);
map:
$headings: (h1: 2em, h2: 1.5em, h3: 1.2em);
2、混合(方法)
不带参数:
@mixin boxc {
width: 100px;
height: 100px;
background-color: #f90;
}
.box {
@include boxc;
}
带参数:
@mixin triangle($direction: left, $bdWidth: 10px, $color: #09f) {
width: 0;
height: 0;