局部變量
body{
$color : red;
color:$color;
}
footer{//footer裏將訪問不到$color變量,因爲它是局部的
color:$color;
}
全局變量
body{
$color : red !global;
color:$color;
}
footer{//footer裏將可以訪問$color變量,因爲它是全局的
color:$color;
}
多值變量
$paddings : 5px 10px 5px 10px;
body{
padding : $paddings;
}
//如果我們只想取一個值 如:
padding-left : nth($paddings,1);
//注意:索引是從1開始的不是從0.
- maps類型
$maps:( color:red , borderColor:blue );
body{
background:map-get($maps,color);
border-color:map-get($maps,borderColor);
}
部分文件
部分文件一般以’_’下劃線開頭 如:_part1.css
我們就可以導入或者引用這個部分文件,減少css的重複
//然後我們就可以導入文件了
@import "_part1.css"
- 下面三種情況被識別爲css原生導入
- 被導入文件是以.css結尾
- 被導入文件是一個URL地址(如:http://xxx/xxx.css)
- 被導入文件的名字是CSS的url()值
//導入sass文件 _part1.scss
@import "part1"
//只用寫文件名就可以了,然後就吧part1的內容寫入當前文件中
//寫'_'和後綴也行