1、继承性
<style type="text/css">
.father{
font-size: 30px;
background-color: green;
}
.child{
color: purple;
}
</style>
</head>
<body>
<!-- 继承：给父级设置一些属性，子级继承了父级的该属性，这就是我们的css中的继承
有一些属性是可以继承下来 ： color 、 font-*、 text-*、line-* 文本元素
像一些盒子元素，定位的元素（浮动，绝对定位，固定定位）不能继承
-->
<div class="father" id="egon">
<div class="child">
<p>alex</p>
</div>
</div>
<p>小马哥</p>
</body>
2、层叠性
总结：
1.先看标签元素（实际显示的内容）有没有被选中，如果选中了，就数数 （id,class,标签的数量） 谁的权重大 就显示谁的属性。权重一样大，后来者居上
2.如果没有被选中标签元素，权重为0。
如果属性都是被继承下来的 权重都是0 。权重都是0:"就近原则" ： 谁描述的近，就显示谁的属性
<style type="text/css">
/*<!-- */
/*层叠性： 权重的标签覆盖掉了权重小的标签，说白了 ，就是被干掉了*/
/*权重： 谁的权重大，浏览器就会显示谁的属性*/
/**/
/*谁的权重大？ 非常简单 数数*/
/**/
/*id的数量 class的数量 标签的数量*/
/*-->*/
#box{
color: red;
}
.container{
color: yellow;
}
p{
color: #2aabd2;
}
</style>
-------------------------------------------------------------------------
/*id的数量 class的数量 标签的数量*/
3、！important
<!-- ！important:设置权重为无限大
!important 不影响继承来的权重，只影响选中的元素 -->
不讲道理的!import方式来强制让样式生效，但是不推荐使用。因为大量使用!import的代码是无法维护的。
<style type="text/css">
p{
color: red !important;
font-size: 30px;
}
.spe1{
color: yellow ;
font-size: 40px;
}
.spe2{
color: green;
font-size: 40px;
} ul{
color: red;
}
.list{
color: purple !important;
}
</style>
选择器的优先级
