div背景显示什么色？
<style type="text/css">
.colorclass{background:red;width:300px;height:200px;}
#colorid{background:black;width:100px;height:100px;}
</style>
<div id="colorid" class="colorclass">
答案：黑色
为什么是黑色，而不是红色，不是就近原则？，后出现的colorclass覆盖前面的colorid样式吗？
css样式中的class，style与id的优先级问题
style，class与id之间的优先级问题，在页面初次完工未经改变，或者页面复杂程度很小的时候，搞不清楚这三者之间的优先级问题，似乎并没有什么大的问题，但是一旦随着页面的更改完善，以及页面元素的错综复杂度增加，问题就显而易见了。
举个栗子：
*{ color:red；}
body{ color:green；}
#id{ color:blue;}
.class{ color:yellow;}
显示效果：
从①和②可以看出样式的定义顺序起了作用，我们把body{color:green}去掉的话，二者将同时显示红色，之所以①显示绿色，是因为body{}在*后面对body所包含的的标签内部进行了重新定义。
第③④⑤条规则的显示结果可以看出，在三中样式规则同时存在的时候优先级最高的是style所定义个属性值，与style，id，class的书写顺序没有关系。
第⑥和第⑦我想大家都明白是怎么一个结果了吧，就是说id与class的优先级为id优先于class，与顺序也没有关系。
总结：id，class，style的优先级别顺序为style高于id高于class。
125jz网原创文章。发布者：江山如画，转载请注明出处：http://www.125jz.com/8809.html
微信扫一扫 
支付宝扫一扫