我见过这个语法:
ul#nav li a
{
}
我不是很确定它的意思,它是否和说“是同义词”一样:
#nav ul li a
我想我不太明白在没有空格的情况下,在ID选择器前面具有元素类型是什么意思...
ul#nav li a
会选择:
<li>
元素内部的<a>
元素...id
属性为nav
的<ul>
中的<li>
元素内部的<a>
元素...它不会选择任何不是<ul>
元素的后代,即使它的id
是nav
。
这有点冗余,因为id是唯一的。实际上,#nav li a
也可以达到同样的效果。
这和说:
#nav ul li a
是一样的吗?
请注意,#nav ul li a
并不相同,这将选择具有id为nav
的另一个元素的后代ul
内部的li
中的a
。
<div id="nav">
<ul>
<li><a>This would be selected</a></li>
</ul>
<div>
<ul id="nav">
<li><a>This would not be selected</a></li>
</ul>
您可以在一个元素上组合多个选择器。这是一个愚蠢的例子:
a#message.error.active[rel="foobar"]:hover {}
#id
应该是唯一的。 - JMax这个选择器选中了一个无序列表内部的列表项中,ID为“nav”的锚点。
因此,
<ul id='nav'>
<li>
<a href='test.com'>Test</a>
</li>
<ul>
<ul>
<li>
<a href='test.com'>Test</a>
</li>
<ul>
它将匹配第一个锚点,而不是第二个。
如果它能够工作,它也不同于第二个,它只会匹配 UL 元素的父元素具有 ID 为“nav”的情况。
tag#id_name
语法是多余的,因为id是唯一的,但在处理类时,该语法非常有用。
ul.nav li { }
可用于区分相同类别的多个标签。 <ul class="nav">
<li>Stuff</li>
</ul>
<ol class="nav">
<li>First Item</li>
</ol>
ul.nav li { }
会影响 "Stuff",而 ol.nav li { }
会影响 "First Item"。
tag#id_name
的确也有使用情况,但它们相当罕见,通常可以避免使用。我很高兴你指出了这在类中的用处。另外:欢迎来到本站!不错的第一篇帖子。 - Wesley Murch
#nav ul
不会应用于每个<ul>
,它将应用于任何<tag id="nav">
中的每个<ul>
。 - Kokos