混合器和选择器

一混合器

1.1混合器

混合器来避免重复。通过使用参数，你可以使用混合器把你样式中的通用样式抽离出来，然后轻松地在其他地方重用。

1.2何时使用混合器

• 一个逻辑单元的一组属性

判断一组属性是否应该组合成一个混合器，一条经验法则就是你能否为这个混合器想出一个好的名字。如果你能找到一个很好的短名字来描述这些属性修饰的样式，比如 rounded-corners、fancy-font 或者 no-bullets，那么往往能够构造一个合适的混合器。如果你找不到，这时候构造一个混合器可能并不合适。 

• html 元素外观的展示性描述

混合器在某些方面跟 css 类很像。都是让你给一大段样式命名，所以在选择使用哪个的时候可能会产生疑惑。最重要的区别就是类名是在 html 文件中应用的，而混合器是在样式表中应用的。这就意味着类名具有语义化含义，而不仅仅是一种展示性的描述：用来描述 html 元素的含义而不是 html 元素的外观。而另一方面，混合器是展示性的描述，用来描述一条 css 规则应用之后会产生怎样的效果。

1.3混合器中的规则 

混合器中不仅可以包含属性，也可以包含 css 规则，包含选择器和选择器中的属性，如下代码:

 1.4混合器传参

混合器并不一定总得生成相同的样式。可以通过在 @include 混合器时给混合器传参，来定制混合器生成的精确样式。sass 也允许通过语法 $key: value 的形式指定每个参数的值。

二选择器继承

选择器继承是说一个选择器可以继承为另一个选择器定义的所有样式。相同的样式列在一起，独有的样式单独列出来。这个通过 @extend 语法实现，如下代码:

2.2继承的高级用法

高级用法是继承一个 html 元素的样式。尽管默认的浏览器样式不会被继承，因为它们不属于样式表中的样式，但是你对 html 元素添加的所有样式都会被继承。

 2.3继承

不要在 css 规则中使用后代选择器，去继承 css 规则。如果你这么做，同时被继承的 css 规则有通过后代选择器修饰的样式，生成 css 中的选择器的数量很快就会失控

你完全可以放心地继承有后代选择器修饰规则的选择器，不管后代选择器多长，但有一个前提就是，不要用后代选择器去继承。