一段代码
<h1 class = "blue" id = "title">article</h1>
在CSS中使用不同的选择器对文字的颜色进行设置。
h1{ color:red;}.blue{ color:blue;}#title{ color:yellow;}
最终的字体颜色是黄色,当然也可以尝试把3种设置顺序颠倒查看效果。
元素采用了某种排序机制,在这一机制种,id选择器优于类选择器,而类选择器又优于标签选择器,因此最后字体显示为黄色。这一类机制就称为优先级机制。
常见选择器的优先级排序(低到高)
1.通用选择器。如*{...}
2.标签选择器。如h1{...}
3.类选择器。如.blue{...}
4.伪类选择器。如a:hover{...}、li:first-child{...}
5.ID选择器。如#title{...}