权重大小
内嵌权重为1000
<p style="color: yellow;">ALEX</p>
id选择器的权重为100,类选择器的权重为10,标签选择器的权重为1.
/*1 1 1*/
#box1 .wrap2 p{color: red;
}
当权重一样的时候,是以后设置的属性为准,后来者居上。
如果标签元素被选中,谁的权重大,就显示谁的属性
.如果没有被选中标签元素,权重为0。
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><style type="text/css">/*此时标签没有被选中,权重为0*/.father{background: green;color: red;}p{color: yellow;}</style></head><body><div class="father" ><div class="child"><p>ALEX</p></div></div></body>
</html>
如果权重都是0 。
权重都是0:"就近原则" : 谁描述的近,就显示谁的属性
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><style type="text/css">/*显示*/.child {color: gray;}.father{background: green;color: red;}</style></head><body><div class="father" ><div class="child"><p>ALEX</p></div></div></body>
</html>
!impantant 权重无限大
.child p{color: gray !important;}