行间样式 权重第一 1000
id选择器 权重第二 100
类选择器 权重第三 10
标签选择器 权重第四 1
行间样式 > id选择器 > 类选择器 > 标签选择器 > *(通配符)
包含选择器优先级计算
把每个选择器的价值相加,权重高则显示
#wrap .list .item
100 + 10 + 10 = 120
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<!--
加wx wzq85006194
-->
<style>
#wrap .list .item{
height: 50px;
background-color: pink;
}
.box #info .item{
height: 200px;
background-color: palegreen;
}
#wrap #info li{
height: 300px;
background-color: peru;
}
</style>
</head>
<body>
<section class="box" id="wrap">
<header class="head"></header>
<ul class="list" id="info">
<li class="item"></li>
<li class="item"></li>
<li class="item"></li>
</ul>
</section>
</body>
</html>