全而简的总结？既全又简，不矛盾吗？不矛盾，全是指涉及的方面完善，简是指介绍最常见的应用。互联网讲究的就是效率，如果而大而全的教程，是没人看的，看了也记不住。麻痹，比话真多。
基础知识
默认样式的优先级最低
比如虽然我们没有指定 li 前面有个黑点，但它实际上显示出来就有，这就是浏览器的默认样式，这个优先级最低。
内联样式的优先级最高
就是直接利用标签的 style 属性写的样式优先级最高。
“页面内嵌样式 > 外部文件样式”这种说法是错误的
网上有人说“页面内嵌样式”的优先级高于“外部文件样式”，其实这种说法是错误的，其实是在选择符优先级一样的情况下，谁在 HTML 代码位置的后面，谁生效（下一条就是说的这个）。
优先级相同的话，写在后面的样式表优先级高
以上示例为了简单，都是使用的 .c1，有相同的优先级。还有，class 属性中可用空格隔开多个 className，在 class 属性中，哪个 className 写在前面、后面，是没有影响的，比如：class="c1 ca" 等效于 class="ca c1"。
近水楼台先得月
id 的优先级是高于 class 的（后面会介绍），但是由于 Hello CSS. 这个内容的“直接领导”是 l4，所以说样式表中 .l2 .l3 虽然用了两级，#l1 虽然是用的 id，但它管不到，所以最终生效的是红色。同理，如果第一句 CSS 不存在，则离 Hello CSS. 最近的是 l3，则第二句 CSS 生效。
最后一个选择符以前的选择符无就近原则
近水楼台先得月的这个就近原则只限于最后一个选择符。如上，最后一个选择符相同，虽然 .l2 比 .l1 更靠近 Hello CSS.，但是这里没有就近原则，所以它们的优先级就要看谁在后了，谁在后谁生效。
另外：近水楼台先得月的这个就近原则没标签啥事。你说你写一个 div { color:red; }，它是不是最贴近于 Hello CSS. 呢？不是的。即使你是唯一的标签，也没标签啥事，标签不参与这个就近原则。
级别评比
优先级：id > class > 标签 > 伪类
同样是上面的 HTML 代码，把 CSS 换成：
最终为红色。
上面是个简单的例子，常用的实际上是多层级的情况下
再看：
如上可以归纳为，层级越是具体，优先级越是高。如果从数学上来说：id 是一个数量级的，class 是一个数量级的，tag 是一个数量级的。无论多少个 class 都抵不过一个 id，无论多少个 tag 都比不上一个 class。
注意：上面的 #l1 .l3、div.l1 div.l2 div.l3 中的 .l3 与 div.l3 都是位于最后一个选择符，但是并不能因为 div.l3 多了一个 div 它的优先级就高，因为它们指向的是同一个元素，这是已经确定了的事，下一步就看前面的选择符谁的优先级高。再看一个例子也是这样的：
但如果只是 .l3 与 div.l3 相比，前面没有其它东西的时候，或者前面是一样的，则 div.l3 是高于 .l3 的。
超链接的垂直管理
垂直管理就像某些机构中的一样，地方特工不受地方政府管理，而受上级特工管理。请参见这篇文章：超链接的伪类听谁的呢？。
