Question

我不确定我的问题标题是否准确显示了我想要问的内容，但这几乎是我第一次接触CSS3，并且一直在探索人们为获得一些实践经验所做的各种项目。

在搜索这些项目时，我发现了一些我在理解方面遇到麻烦的事情。以下两行之间究竟有什么区别：

#random_ID > ul > li > a { ... }

#random_ID ul li a { ... }

这些只是两种写同样的方式吗？任何帮助将不胜感激！

Answer 1

大于号符号将查找限制为第一级后代：左侧选择器的子级。没有符号，它可以是任何级别的任何后代。

所以第一个例子，它是“带有子孩子的带有孩子的孩子的带有孩子的随便的ID”，第二个是“带有任何后代的带有任何后代的带有任何后代的带有任何后代的随机数字的随机数字”，

Answer 2

>表示“直接孩子”。如果元素（>右侧的元素）是父元素的直接子元素（>左侧的元素），则仅对其进行样式设置

所以说如果我有以下布局：

<div>
  <ul>
    <li></li>
    <li></li>
  </ul>
</div>

div > li { background: red; }无效，因为li不是直接的孩子，而div > ul > li>或div li会有效。

应该注意的是，并非每个浏览器都支持直接子标记，特别是旧版本的Internet Explorer，所以不要依赖它，或者如果你使用它，就会有一些后备。