有一个很长的CSS选择器坏吗?

时间:2013-01-25 09:43:30

标签: css css3

是一个像

这样的选择器
.a, .b, .c, .d, .e, .f, .g, .h, ......... , .zzzzz {font-size:16px}

表现不好?如果是,如何,如果没有原因?

我用Google搜索并阅读了许多帖子,包括Mozilla的帖子,并且没有发现任何提及大量类名作为选择器的问题。

4 个答案:

答案 0 :(得分:7)

不,这里没有性能问题。

什么是坏的是涉及许多检查的长选择器,但你的选择器实际上是一系列选择器,相当于

 .a {font-size:16px}
 .b {font-size:16px}
  ...

只有一个班级的选择者才是最有效的选择者。

没有真正的问题,即使您可能应该使用较少的类来更轻松地管理代码。

答案 1 :(得分:2)

这是一次为多个类分配公共属性的有效语法。没有副作用。

答案 2 :(得分:2)

保存一口就好了。是的@dystroy表示它对你的网页性能影响不大,但它不是一个好的编码粒子和也很难管理你的代码。

像这样写:

body{font-size:16px}

答案 3 :(得分:0)

您没有选择大型选择器,只是为样式表分配了许多选择器。例如,大型选择器将是:

header nav ul li a

当浏览器从右到左使用选择器时,键选择器(行中的最后一个选择器,在本例中为锚元素a)过于笼统。当开始渲染样式时,浏览器开始根据键选择器抓取所有元素,这可能意味着它有更多元素,这是有效需要的。在这个例子中,如果导航项获得唯一的类会更好,所以样式表只能应用于后面的选择器:

.primary-link

因此,它会为您的样式导入正确的键选择器,以将渲染时间减少到最小。

如果您想阅读有关CSS选择器和性能的有趣内容,我可以推荐该页面:http://learn.shayhowe.com/advanced-html-css/performance-organization