css优先级

来源:互联网 发布:python 矩阵转图片 编辑:程序博客网 时间:2024/06/05 18:55

css的优先级从高到低:内联样式、内部样式、外部样式、浏览器默认样式。

在优先级相同的情况下,后定义的属性会覆盖先前定义的。


行内样式>id>class>类型选择>通配符选择

类型选择:<style>

div{background:red}

p{background:blue}

 </style>

通配符选择:<style>

*{background:yellow}

      </style>


对于包含选择:有种约分滴感觉

<style>

#box .box2{width:100px; height:100px; background:red}

.box #box2{background:blue;}

/*以上两个包含选择器的优先级是相同的,所以是哪一个在后面,就会覆盖前面的*/

</style>


<body>

<div id="box" class="box">

<div id="box2" class="box2"></div>

</div>

</body>

群组选择器

<style>

.div, .p{width:100px; height:100px; background:red}

.p{background:blue;}

/*以上的优先级是相同的*/

</style>


<body>

<div class="div"></div>

<p class="p"></p>

</body>



0 0
原创粉丝点击