对于规则分类的第一步发生在主选择符类别基础上。这个分类的目的是把那些不需要浪费时间匹配的规则过滤出来。这是显著提升性能的重点。对于一个给定的需要匹配的元素，规则越少，样式的渲染越快。例如，元素有一个 ID，那么只有和元素 ID 匹配的 ID 规则会被检索。只有和元素的 class 匹配的 class 规则会被检索。只有和 tag 匹配的 tag 规则会被检索。全局规则总是会被检索。
高效 CSS 指南
避免全局规则
确保规则不以全局分类结束
不要给 ID 分类规则指定标签名或者 class
如果有一条样式规则是以 ID 选择符为主选择符的，就别再画蛇添足的加上标签名了。ID 都是唯一的，因此加上标签名反而会无谓地拖慢匹配过程。(当有不同元素使用同一类名，而又需要动态地改变其中一个元素的类名来针对不同情况应用不同样式时是个例外。)
BAD – button#backButton { }
BAD – .menu-left#newMenuIcon { }
GOOD – #backButton { }
GOOD – #newMenuIcon { }
不要给 class 分类规则指定标签名
和以上规则类似，所有的类名也是唯一的。标签和类名连缀的写法是一个惯例(但是，如果设计的变更使得需要改变标签就会有灵活性的问题，因为也需要改变 class — 最好选用具有严格语义的名字，这种灵活性也是分离样式表的目标之一)。
BAD – treecell.indented { }
GOOD – .treecell-indented { }
BEST – .hierarchy-deep { }
尽量把规则应用到最明确的类上
拖慢系统最大的一个原因是有太多的 tag 分类规则了。通过给元素增加类名，可以把这些 tag 类里的规则分一部分去class 分类，就可以不需要浪费时间来试图给一个标签匹配那么多的的规则了。
BAD – treeitem[mailfolder="true"] > treerow > treecell { }
GOOD – .treecell-mailfolder { }
避免后代选择符
CSS 中，后代选择符(descendant)[注1]的耗能高的可怕，尤其是选择符的规则是在 tag 或者全局分类中。子选择符(child selector)则经常是真正所需。如果没有主题模块所有者的明确允许，UI CSS 中禁止使用后代选择符。
BAD – treehead treerow treecell { }
BETTER, BUT STILL BAD (see next guideline) – treehead > treerow > treecell { }
Tag 类规则中最好不要包含后代选择符
避免使用具有 tag 类规则的后代选择符。这会明显地增加匹配时间（尤其是这些规则会被多次匹配时）。
BAD – treehead > treerow > treecell { }
BEST – .treecell-header { }