标签:
一、什么是CSS优先级?
所谓CSS优先级,即是指CSS样式在浏览器中被解析的先后顺序。
二、CSS优先级规则
1、每个具有style=“”,权重为1000
2、每个ID选择符(#someid),权重为100
3、每个class选择符(.someclass)、每个属性选择符(形如[attr=value]等)、每个伪类(形如:hover等)加权重为10
4、每个元素或伪元素(:firstchild)等,加权重为1
5、其它选择符包括全局选择符*,加0,0,0,0。相当于没加,不过这也是一种specificity,后面会解释。
6、出现!important 权重最高!!!
7、
三、具体例子
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>demo</title>
<style type="text/css" media="screen">
#text{color: red}
.text{color: blue;}
</style>
</head>
<body>
<div id="text" class="txt">
<p>
<span>测试文字</span>
</p>
</div>
</body>
</html>
测试结果为 red
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>demo</title>
<style type="text/css" media="screen">
div.txt p span{color: orange}
.txt p span{color: red}
.txt1 span{color: blue}
</style>
</head>
<body>
<div id="text" class="txt">
<p class="txt1">
<span>测试文字</span>
</p>
</div>
</body>
</html>
测试结果为 orange
标签:
原文地址:http://www.cnblogs.com/yanwei-sun/p/5197478.html