css - .class > .class 和 .class .class 的区别

Question

我只想知道它们之间的区别:

.class .class{
font-size:14px;
}

对比:

.class > .class{
font-size:14px;
}

是一样的东西吗？

Answer 1

不，它们不一样 - 第一个例子是 descendant selector , 第二个是 direct child selector .

---

.class .class 将针对具有类 .class 的所有元素，这些元素派生自具有类 .class 的任何元素，例如

<div class="class">
 <div class="other">
    <div class="class"> This is targeted. </div>
 </div> 
</div>

jsFiddle example

---

.class > .class 将仅针对具有类 .class 的元素的直接子元素，例如

<div class="class">
   <div class="other">
      <div class="class">This isn't targeted.</div>
   </div> 
   <div class="class">
      <div class="class">This is targeted, as it is a direct child.</div>
   </div>    
</div>

jsFiddle example.