css优先级

CSS 快速掌握 admin 371浏览

行内样式>ID选择器>类选择器>标签选择器

一般而言,选择器指向的越准确,优先级就会越高。通常我们会用1来表示标签选择器的优先级,用10来表示类选择器的优先级,用100来表示ID选择器的优先级,用1000来表示行内样式。

值越大表示其优先级越高。

不管是单个选择器还是多个选择器组合它们之间的优先级都可以通过上面这个公式来进行计算。我们将其值称之为权重值。权重值越大就表示其优先级越高。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
		p{
			color: #f00;
		}
		.box p{
			color: #0f0;
		}
		#box p{
			color: #00f;
		}
		</style>
	</head>
	<body>
		<p class="box" id="box" style="color: skyblue;">完整版!马斯克得州工厂致辞:年产百万台,明年交付电皮卡、人形机器人</p>
	</body>
</html>

转载请注明:大灰牛博客 » css优先级