您的位置:首页 > Web前端 > CSS

css选择器的优先级别

2015-06-17 12:27 501 查看
<html><head lang="en">
<meta charset="UTF-8">
<title></title>

<!--
css选择器遵循:
1.在相同级别:1.叠加原则  2.就近原则
2. id选择器> 类选择器 > 标签选择器
3. 范围越小,优先级别越高
-->
<style>

div#main{  /*101*/
color: goldenrod;
}

/*id选择器*/
#main{  /*100*/
color: deeppink;
}

/*类选择器*/
.test2{   /*10*/
color: purple;
}

.test1{   /*10*/
color: yellow;
}

/*标签选择器*/
div{   /*1*/
color: red;
}
div{  /*1*/
color: green;
}
div{   /*1*/
color: blue;
font-size: 100px;
}

*{  /*1000*/
color: darkgreen  !important;
}
</style>
</head>
<body>
<div id="main" class="test1 test2" style="color: red">111111</div>

</body></html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: