这些选择器有什么区别？ [复制]

【问题标题】：what is the difference between these selectors? [duplicate]这些选择器有什么区别？ [复制]
【发布时间】：2018-12-17 21:29:01
【问题描述】：

我找到了两个选择器

div p

和

div>p

这两个 css 选择器之间的确切区别是什么？

【问题讨论】：

【解决方案1】：

div p这个样式会选择div下的所有p元素，不管p是否在另一个div里面。 div>p 只会选择 div 下的 p。如果在同一个 div 中有另一个 div 也有 p 元素，它不会选择那个 p。

【讨论】：

"如果在同一个 div 中有另一个 div 也有 p 元素，它不会选择那个 p。"当然会，只是没有选择相同的开始元素。在<div id="root"><div><p>P</p></div></div>、div > p、div p、div#root p都会选择<p>； div#root > p 不会选择它。
是的，绝对正确;)

【解决方案2】：

div p {
  color: red;
}

<div>
  Div
  <p>Child</p>
  <aside>
    <p>Grandchild</p>
  </aside>
</div>

div > p {
  color: red;
}

<div>
  Div
  <p>Child</p>
  <aside>
    <p>Grandchild</p>
  </aside>
</div>

【讨论】：