了解这些列表选择器的差异

Question

我正在使用具有两个不同规则的样式表：

#main_navigation ul li{ ... }

和

#main_navigation li{ ... }

我不清楚如何解释差异。在我的推理中 - 'li'不能独立于 ul 或 ol 。

上面说的是“对无序列表中的所有项目使用第一个”但是对任何列表项使用第二个吗？

Answer 1

是

第一个说“将以下规则应用于li的所有ul，后者又是main_navigation元素的后代。”

第二个说“将以下规则应用于所有li，它们是ID为main_navigation的元素的后代。”

Answer 2

是的。第二条规则匹配有序<li>和无序<ol>列表中的<ul>元素。第一个是更具体的，只匹配无序列表项。

Answer 3

是。如果<li>位于<ul>之下，它将匹配第一条规则以及第二条规则。

Answer 4

第一行代码说“应用此样式列出id为main_navigation的div中无序列表的项目”

第二行代码说“将此样式应用于列出id为main_navigation的div中任何类型列表的项目”