【CSS】选择器优先级

1、选择器（优先级）

选择器种类：
严格来讲，选择器的种类可以分为三种：标签名选择器、类选择器和ID选择器。
而所谓的后代选择器和群组选择器只不过是对前三种选择器的扩展应用。
而在标签内写入style=""的方式，应该是CSS的一种引入方式，而不是选择器，因为根本就没有用到选择器。
而一般人们将上面这几种方式结合在一起，所以就有了5种或6种选择器了。
选择器优先级：
CSS选择器效率从高到低的排序如下：
1.id选择器（#myid）
2.类选择器（.myclassname）
3.标签选择器（div,h1,p）
4.相邻选择器（h1+p）
5.子选择器（ul > li）
6.后代选择器（li a）
7.通配符选择器（*）
8.属性选择器（a[rel=“external”]）
9.伪类选择器（a:hover, li:nth-child）
那么是如何计算优先级的呢：
一般而言，选择器越特殊，它的优先级越高。也就是选择器指向的越准确，它的优先级就越高。
通常我们用1表示标签名选择器的优先级，用10表示类选择器的优先级，用100表示示ID选择器的优先级。
比如说：
.polaris span {color:red;}的选择器优先级是10 + 1也就是11；而.polaris的优先级是10；浏览器自然会显示红色的字。
例如下面的优先级计算：

div.test1 .span 优先级 1+10 +10
span#xxx .songs li 优先级1+100 + 10 + 1
#xxx li 优先级 100 + 1

在这里不得不提使用在标签内引入CSS的方式来写CSS，即：

<div style="color:red">polaris</div> 

这时候的优先级是最高的。我们给它的优先级是1000.