Question

我知道这很挑剔但是我正在和编辑一起工作，这会让CSS发现并不断抱怨

don't use adjoining classes > e.g.  .foo.bar

我忽略了这些警告，但它让我很好奇，无法在上面找到任何东西。说我有：

  <ul class="foo bar"></ul>

哪个CSS选择器更快：

  ul.foo
  .bar.foo

我知道选择器从右到左工作，因此在两种情况下都会先选择foo，之后浏览器必须找到在选择中找到所有ul（？）或全部{{} 1}}元素（？）。

问题：
在CSS中，.bar比[class][class]更快？

谢谢！

Answer 1

为了完整起见：为什么css lint会抱怨？
答：相邻的课程不适用于一些非常古老的浏览器。

不要使用相邻的课程

相邻的类看起来像.foo.bar。虽然技术上允许使用CSS，这些无法通过 Internet Explorer 6 及更早版本正确处理。

Answer 2

我认为一般规则，以及我自己注意到的一个规则是，使用.class .class稍微快一点，虽然它取决于页面本身（我想应用了哪些样式）在一定程度上。）

通常同意不同选择器的速度（从最快到最慢）;

ID - ＆gt;类 - ＆gt;类型 - ＆gt;相邻 - >孩子 - ＆gt;后裔 - ＆gt;通用 - ＆gt;属性 - ＆gt;伪

就个人而言，我想从标记的角度来看，我也会发现使用类来选择第一个元素更有利。它避免了如果将来要添加一个相同类型的元素可能会受到CSS的影响。

这也符合许多CSS编写指南，它们说使用类进行样式化更有意义。

我还记得一个涵盖CSS效率的good article。我希望这篇文章现在与我同意，因为我暂时还没读过它。在网站的某个地方，他们也会看到编写CSS的Block Element Modifier技术，如果你想更有效地构建你的CSS，这是一个有趣的阅读和一个很好的起点（虽然它需要一点点了解第一个时间）。