关于ID和Class的CSS最佳实践？

我一直在深入研究有关CSS的SitePoint书籍.

让我了解这些例子的是使用ID作为CSS选择器.

我已经完成了一些CSS设计,我总是发现使用Class作为选择器更容易,更通用.

也许它是一个.Net的东西,因为我们并不总是控制元素的ID ...

这里最好使用CLASS或ID作为选择器吗？

1> nickf..：

---

我猜他们总是在示例中使用id,因为它不那么含糊.你知道他们正在特别谈论那个元素及其风格.

一般来说,经验法则是你应该问自己:"现在还是在未来的任何时候,是否有不止一个要求相同风格的元素？",答案甚至是"可能",然后再做一类.

---

同意.选择暗示唯一性的ID名称可能会有所帮助,例如"mainsection"或"navbar".

2> Ola Tuvesson..：

---

不要忘记,类和ID不是互斥的.没有什么可以阻止你两者兼得!这有时非常有用,因为它允许项目继承常见样式以及同一类的其他元素,并使您可以精确控制该特定项目.另一个方便的技术是将多个类应用于同一个对象(是的,class="someClass someOtherClass"完全有效)例如:

a wide box
a narrow box
an odd box

从理论上讲,也可以将CSS仅应用于属于多个类的项目,例如div.box.narrow {something: somevalue;}但不幸的是,并非所有浏览器都支持此类.更新2011:多个类选择器现在具有接近通用的浏览器支持,因此请继续使用它们!

---

除非你小心,否则这也是一个很好的方式来挖掘自己一个漂亮而深邃的洞.;) 根据经验; 类(或者那个问题的ID)永远不应该有描述外观的名称,而应该描述功能.

---

有一个例子说明这将导致"一个漂亮而深的洞"？

---

只是为了预热旧线程:`div#oddOneOut`中的`div`选择器是不必要的.由于_id_属性在整个页面中是唯一的,因此`#oddOneOut`选择器将足够精确以匹配该元素.

3> alexmeia..：

---

不要忘记您可以链接到具有ID的元素.除了其他好处之外,这对于可访问性非常重要.对于标题,导航,主要内容,页脚,搜索表单等布局元素,这是一个很好的理由,您应该始终使用ID而不是Class(或与Class一起使用).

4> Zak Linder..：

---

另一个有用的资源是关于级联顺序的W3C规范:id选择器的权重是选择器的十倍class.如果您计划根据不同的方案或状态更改覆盖样式,这一点尤为重要.初始选择器越具体,在额外声明中覆盖它的工作就越多.

---

不,不是十次,无限次!再读规范:"串联的三个数字(与大基数的数字系统)给出的特异性"在这句话中,"大基地"只有足够大时,一个单一的ID将覆盖任何数量级的.