1.变量
Sass 变量使用 $ 符号
可以存储的信息：字符串、数字、颜色值、布尔值、列表、null值
/* 1.变量声明 */
/* $variablename: value; */
$myFont: Helvetica, sans-serif;
$myColor: red;
$myFontSize: 18px;
$myWidth: 680px;
/* 在代码中使用 */
body {
font-family: $myFont;
font-size: $myFontSize;
color: $myColor;
}
.container {
width: $myWidth;
}
2.作用域
/* Sass 变量的作用域只能在当前的层级上有效果 */
$myColor: red;
h1 {
$myColor: green; // 只在 h1 里头有用，局部作用域
color: $myColor;
}
p {
color: $myColor;
}
// ==> h1{color: green;} p{color: red;}
3.!global
$myColor: red;
h1 {
$myColor: green !global; // 全局作用域
color: $myColor;
}
p {
color: $myColor;
}
// ==> h1{color: green;} p{color: green;}
/* 现在 p 标签的样式就会变成 green */
上一篇：1.Sass简介 >>
下一篇：3.Sass 嵌套规则与属性 >>
