连接id和html标签之间的区别,即ul#nav vs #nav ul

Question

我只是在玩css ul菜单.我最初的css

#nav ul {...}

没用,但是

ul#nav {...}

工作.这是什么原因？

另一个类似的问题是:有什么区别:

div.grey

要么

div .grey

注意两者之间的空间......

Answer 1

#nav ul查找ulid为"nav" 的元素中的元素.

<div id="nav">
  <ul>
    <li>Like me</li>
  </ul>
</div>

ul#nav寻找ul具有id值为"nav"的id.

<ul id="nav">
  <li>Like me</li>
</ul>

类名同样如此:

div.grey查找div具有类名"gray" 的元素.

<div class="grey">Foo</div>

而div .grey寻找在a中具有类名"gey"的任何元素div.

<div>
  <p class="grey">
    I'm special!
  </p>
</div>