[翻译]标记语言和样式手册 Chapter 9 精简标签（3）

越少分类越好维护

除了减少需要使用的源代码空间之外,用继承选择器代替多余分类还代表了标记内容未来易于扩展.

举例来说,让我们假设你想让sidebar之内的链接变成红色,而不是像页面的其余部分那样使用蓝色,因此你建立了一个red类,像这样加到锚点标签中:

<div id="sidebar">
  <h3>About This Site</h3>
  <p>This is my site.</p>
  <h3>My Links</h3>
  <ul>
    <li><a href="archives.html" class="red">Archives</a></li>
    <li><a href="about.html" class="red">About Me</a></li>
  </ul>
</div>

而把这些链接变成红色(假设预设的链接颜色不是红色)则需要类似这样的CSS:

a:link.red {
  color: red;
  }

这些动作没什么问题,也完全可以正常运作,但是如果未来你改变心意,想把这些链接换成绿色的话怎么办?或者更实际一点,你的老板偶尔说了"今年红色已经过时了,把这些侧边栏链接换成绿色"!没问题,你只要修改CSS里的red类就搞定了,但是标记内容里的class属性还是red,明显这不完全符合语义,就跟使用其他颜色当作分类名称一样.

这不是个使用显示效果当作分类名称的好地方,但是完全不指定分类的话,我们能省去许多处理分类的精力(以及代码),同时让内容语义更合理,我们倒不如以继承选择器选择这些侧边栏的链接,依照需要指定样式.

标记内容和方法B完全相同,而设定侧边栏的链接所需的CSS将是这样:

#sidebar li a:link {
  color: red;
  }

基本上,这代表"只有在<div id="sidebar">之内的<li>标签里的使用了href属性的锚点标签应还显示成红色".

现在,我们维持了简短灵活的标记内容,而未来更新只需要用到CSS,不管想让链接变成红色,绿色,粗体,斜体都没问题.