### **1.21. 默认值** **定义**:sass的默认变量仅需要在变量值后面加上!default,即可变成默认值。 <br/> <br/> #### **一、全局覆盖默认变量:** **操作:**在默认变量“**之前**”重新声明下变量的值。 sass样式 `$line-height:2;//重新声明变量` `$line-height:1.5;//默认变量` ~~~ body{ line-height: $line-height; } ~~~ 转化成css ~~~ body{ line-height:2; } ~~~ **注意点:** **1.**如在默认变量“**之前**”重新声明变量值,则后面使用该变量名称的值均为默认值之前**重新声明的变量值**。 <br/> **2.**如在默认变量“**之后**”重新声明变量值,则相当于没有默认值,**按照从上到下**,下面的覆盖下面的规则进行覆盖。 则:第一个default会被第二个default覆盖。第二个default会被没有声明default的变量覆盖,所以最终输出的是没有声明default的变量 列: sass样式: ~~~ $height:300px!default; $height:400px; ~~~ 则相当于: ~~~ $height:300px; $height:400px; ~~~ 则后面的变量名为:$height的值均为400px; <br/> <br/> <br/> #### **二、局部覆盖默认值** 则在需要局部默认的样式里重新定义变量值。 列: `默认变量:$line-height:40px!default;` 如h6需要行高为30px;,但希望后面仍然使用40px的行高。 则写成: scss样式为: ~~~ h6{ $line-height:30px!; line-height:$line-height; } ~~~ 则转化成css: h6{ line-height:30px; } 如果该h6有子代或后代,则后代在样式中同样子给样式赋予该变量名,则该变量的值是h6中重新定义的值,非默认值。