如果CSS选择器是#id,你需要确定它们的范围吗？

<div id="main">
  <div id="sidebar">
    <div id="tag-cloud"/>
  </div>
</div>

#main #sidebar #tag-cloud { ... }
#tag-cloud { ... }

要看.大多数时候,你可以说：

#tag-cloud { ... }

是最好的(性能方面,见下文).这个：

#main #sidebar #tag-cloud { ... }

只是做了很多不必要的检查,必然会成功.

除非你想这样做：

#sidebar #tag-cloud { ... }
#not-sidebar #tag-cloud { ... }

在这种情况下,作用域定义了不同的外观,具体取决于#tag-cloud的位置.当然,您的页面中只能有一个#tag-cloud,但无论如何,您的CSS都可以处理这两种情况.

CSS检查从右到左完成.这个：

#main #sidebar #tag-cloud { ... }

评估为：“具有ID标签的元素 – 云,其父级具有ID侧边栏,其父级具有ID主.如果这是您的网站的外观,那么这只是一大堆无用的DOM遍历.

更不用说过度具体,多余的范围,如果你修改你的站点结构,整个CSS必须在很多地方改变,这在某种程度上违背了目的.