第一等级 :代表内联样式,如:style="" ,权值为1000
第二等级:代表id选择器,如:#content,权值100
第三等级:代表类,伪类和属性选择器,如:.content .conter:hover [type="text"],权值为10
第四等级:代表类型选择器和伪元素选择器 a a:before a:after,如div p,权值为1
ps:通用选择器(*),子选择器(>)和相邻同胞选择器(+)并不在这四个等级中,所以他们的权值都为0
伪类和伪元素的根本区别在于:它们是否创造了新的元素(抽象)。从我们模仿其意义的角度来看,如果需要添加新元素加以标识的,就是伪元素,反之,如果只需要在既有元素上添加类别的,就是伪类。
:first-child 伪类
::after ::before 伪元素