0

有点菜鸟，所以需要一些现实世界的建议。

我刚刚阅读了 mozilla 写的一篇关于使用 css 选择器的文章。

基本上，他们说不要使用复杂的选择器树，例如：

.class-a .class-b > .class-c is better expressed as  custom-class-abc

显然他们会这样做，因为第二个选项会更好地提高浏览器的性能，但如果这是最好的解决方案，那么它会让很多 CSS 基础变得多余。

我有一个包含 LI 的 UL，其中包含 A。我的第一个 A 需要区别对待，所以我使用以下语法：

#footer li:first-child a {}

如果我要遵循 Mozilla 的最佳实践，这将是：

#footer a.first or #footer .first (after adding a class to the first A element)

有足够的东西要学习，所以希望得到一些关于这一切在现实世界中如何运作的建议。

4

2 回答 2

2

你的选择器很好。没有读过你提到的文章，我猜他们的意思是避免类似的事情

html body div.wrapper div.navigation ul.nav li:first-child a.item { }

然后做

.nav li:first-child a.item

本文提供了更多关于为什么更少的选择器对性能更好的原因。当然，任何事情都有极端，Mozilla 应该建议如何使事情尽可能快，但选择器已经非常快了，所以在大多数情况下它没有区别。

在相关说明中阅读 css 中的特异性也可以帮助您确定实际需要选择多少。http://coding.smashingmagazine.com/2007/07/27/css-specificity-things-you-should-know/

于 2013-01-17T14:26:21.773 回答
1

我认为这篇文章可能已经过时以迎合笨拙的浏览器，但大多数最新的浏览器现在都理解 :first-child 。你的例子

#footer li:first-child a {}

我就是这样摇滚的。ie8 不明白 :last-child 注意。

于 2013-01-17T14:23:27.800 回答