css - 在 CSS 中，.a.b 与 .a .b 不同吗？

Question

在我的 css 文件中 .a.b 与 .a .b 不同吗？

这是一个简单的问题，但它总是让我很恼火。我试过了，但我想我会把它贴在这里以防它作为引用有用。

Answer 1

In my css file is .a.b different than .a .b?

是

.a.b 是一个或多个具有两个类的元素。

<div class="a b">(target)</div>

.a .b 是一个或多个具有 b 类的元素，任何 具有 a 类的父元素

<div class="a"><div class="b">(target)</div></div>

甚至

<div class="a">
  <div>
    <div>
      <div class="b">(target)</div>
   </div>
   <div class="b">(target)</div>
   <div class="b">(target)
     <div class="b">(target)</div></div>
  </div>
</div>

它们非常不同。

我在示例 .a .b 中选择了从右到左的方向，因为所有 .b 元素都是 CCS 的目标。

此外，您甚至可以为我的第一个示例执行 div.a.b，为第二个示例执行 div.a div.b。

相关文章:

https://www.smashingmagazine.com/2007/07/css-specificity-things-you-should-know/