!important 的绝对控制样式

dingbin1973

于 2018-11-14 17:43:00 发布

阅读量164

点赞数

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/YKingcc/p/9959269.html

本文详细解析了CSS中内联样式、内嵌样式及外联样式之间的优先级关系，特别是当使用!important属性时，内嵌样式如何超越内联样式的情况，并讨论了在不同情况下如何调整样式优先级。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

	<head>
        　　<style type="text/css">
		div{background-color: blue !important;}
	　　</style>
	</head>
	<body>
	　　<div style="width: 100px;height: 100px;background-color: red;"></div>
	</body>

　　一般来说内联样式的优先级权重大于内嵌样式

直接在div标签上写style属性叫做内联样式而在head标签里定义的style标签里写的叫内嵌而通过css文件加载的叫外联

上面的代码可以看出，使用了!important属性后，内嵌样式高于了内联样式

当然，如果你在内联样式又加一个

background-color: red !important;  那么内联又高于了内嵌

转载于:https://www.cnblogs.com/YKingcc/p/9959269.html