1.当同一个元素指定多个选择器,就会有优先级的产生
(1)选择器相同,则执行层叠性(哪个元素距离最近,就使用谁)
(2)选择器不同,则根据选择器权重执行
(3)如下图,从上到下权重逐级增加
注释:元素选择器为标签选择器
2.代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>CSS优先级</title>
<style>
div{
color: blue!important;
}
.test{
color: red;
}
#demo{
color: green;
}
</style>
</head>
<body>
<div class="test" id="demo" style="color:purple">CSS优先级</div>
</body>
</html>
3.运行效果