标签：
后缀：
sass有两种后缀文件：一种后缀名为sass，不使用大括号和分号；另一种就是我们这里使用的scss文件，这种和我们平时写的css文件格式差不多，使用大括号和分号。
下面举出 后缀为sass文件写法：
body
background:#eee
font-size:12px
导入
sass的导入(@import)规则和css的有所不同，编译时会将@import的scss文件合并进来只生成一个css
@import "reset.scss"
@import "a"
p{
background:#eee;
}
编译出来的文件
@import "reset.css"
body{
background:#eee;
}
注释：
sass两种注释，一种是标准css注释/** **/另一种则是//双斜杠单行注释
/**
*我是css标准注释
**/
body{
padding:5px;
}
//我是双斜杠单行注释
body{
padding:5px;
}
变量：
sass变量必须是$开头，后面紧跟变量名，而变量值和变量名之间需要：隔离。
$fontSize:12px;
body{
font-size:$fontSize;
}
默认变量
sass的默认变量仅需要在值后面加上!default
$baseLineHeigh: 1.5!default;
sass的默认变量一般是用来设置默认值，然后根据需求覆盖的，覆盖的方式就是在默认变量前写个相同的变量
//
//
$baseHeight: 2;
$baseHeight:1.5 !default;
body{
line-height:$baseHeight;
}
//
body{
line-height:2;
}
特殊变量
一般我们定义的变量都为属性值，可以直接使用，但是如果变量作为属性或在某些特殊情况下等则必须要以 #{$variables}形式使用。
$borderDirection: top !default;
//应用于class和属性
.border-#{$borderDirection) {
border-#{$borderDirection):1px solid #ccc;
}
}
标签：
原文地址：http://www.cnblogs.com/wq123/p/4396480.html
