这些选择器之间有什么区别?

-1 css css-selectors

我找到了两个选择器

div p
Run Code Online (Sandbox Code Playgroud)

div>p
Run Code Online (Sandbox Code Playgroud)

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

Ama*_*dan 7

  • 第一个是"后代"选择器:p内部任何地方div

div p {
  color: red;
}
Run Code Online (Sandbox Code Playgroud)
<div>
  Div
  <p>Child</p>
  <aside>
    <p>Grandchild</p>
  </aside>
</div>
Run Code Online (Sandbox Code Playgroud)

  • 第二个是"孩子"选择器:p直接在div

div > p {
  color: red;
}
Run Code Online (Sandbox Code Playgroud)
<div>
  Div
  <p>Child</p>
  <aside>
    <p>Grandchild</p>
  </aside>
</div>
Run Code Online (Sandbox Code Playgroud)