了解CSS选择器

Question

为什么下面的文字是红色的？

#stories li a {color:red}
.default li.expand a {color:green}
li.expand a {color:blue}

---

<ul id="stories" class="default">
   <li>this is the end</li>
   <li class="expand">this is the end</li>

只有当我把#stories放在其他文件上时,文本才会改变.#是否有更多的优势,即使它进一步上升到css？!

Answer 1

这是"CSS特异性"的问题.安迪克拉克的文章CSS:Spcificity Wars做得很好,用一点点幽默来解释它.虽然Eric Meyer在他的评论中增加了更多的清晰度.

Answer 2

根据http://htmldog.com/guides/cssadvanced/specificity/,'# '(一个id选择器)具有最高的特异性,所以是的,带有'#'的任何东西都会先于任何没有的东西,如果他们引用的话同样的事情.

检查该链接以获取更多信息.