CSS的优先级
2017-08-18 本文已影响3人
放飞吧自我
CSS选择器的优先级问题：作用元素一样，样式一样，就会发生冲突
选择器的类型有：通配选择器、标签名选择器、class选择器、id选择器、群组选择器、后代选择器。后代选择器有一个相加的过程，而群组选择器没有这样的过程。
1.类型相同的选择器，在样式发生冲突时，后面的覆盖前面的
如：
div{
width:100px;
height:100px;
background:red;
}
div{
background:green;
}
这个最后的结果是出现一个100*100的绿色的块
2.不同类型的选择器，在样式发生冲突时，优先级高的覆盖优先级低的
在html中：<div class="cla1"></div>
在CSS中：
div{
width:100px;
height:100px;
background:blue;
}
.cla1{
background:red;
}
最后出现的结果是100*100的红色块
优先级的大小：通配选择器（*）< 标签名选择器（Tags）< class选择器 < id选择器 < style < !important
