css的层叠性

标签：#css的权重# 时间：2018/10/06 22:29:37 作者：Shino

```java
	<style type="text/css" media="screen">
     /*css的层叠性：就是css处理冲突的能力*/
     p{
     	color: red;
     }
     .pp{
     	color: green;
     }
     #para1{
     	color: blue;
     }
/*当选择器选择上某个元素的时候 需要这么统计权重：
     id的数量，类的数量，标签的数量。*/
     /*层叠性的特点：
     ①不进位（实际上可以进位 255:1 然而一般无意义）;*/
     div div div div p{
     	color: red;
     }
     .yanse{
     	color: blue;
     } /*虽然标签选择器数量很多但是还是比不上一个类选择器*/
     /*并集选择器（分组选择器）要拆开计算 不能合着算*/
     
    /* ②如果权重一样（id，类，标签数量一样）
     谁写在后面听谁的*/
     #box1 .hezi2 p{
     	color: red;
     }
     #box2 div .pp{
     	color: blue;
     }/*应为这个写在后面所以颜色是蓝色*/

/*如果不是直接选择到的属性 通过继承来的属性权重为0*/
     #box{
     	color: red；
     }
     .pp2{
     	color: blue；
     }/*虽然上面的id标签等级比类标签高 然而显示的颜色还是蓝色*/
     /*开始数权重之前一定要先看一看选择器最内侧标签是否选中目标*/

/*如果属性都是继承来的 权重都是0 那么谁近听谁的*/

</style>
</head>
<body>
     <p class="pp" id="para1">颜色</p>

<div id="box">
     	<p class="pp2">颜色</p>
     </div>
</body>
  css权重总结：
  ① 先看有没有选中 如果选中了 那么以（id数，类数，标签数）来计权重 谁大听谁
  ② 如果没有选中，那么权重是0 此时只以就近原则选择属性
  所有权重问题 没有兼容性问题
  ```

css的层叠性

欢迎大家关注DataLearner官方微信，接受最新的AI技术推送

相关博客

最热博客