17权重计算

最新推荐文章于 2024-09-14 08:09:14 发布

雪花酥01

最新推荐文章于 2024-09-14 08:09:14 发布

阅读量410

点赞数 5

分类专栏：大前端 # css 文章标签： css 前端 html

本文链接：https://blog.csdn.net/shuozai1204/article/details/141181679

版权

大前端同时被 2 个专栏收录

164 篇文章 0 订阅

订阅专栏

css

89 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>权重计算</title>
    <style>
        /*
            .box 类名选择器  0010
            #h   id选择器    0100
            .span 类名选择器 0010
            .box #h .span： 0010 0100 0010
         */
        .box #h .span {
            background-color: red
        }

        /*
            .box 类名选择器 0010
            h1   标签选择器 0001
            .span  类名选择器 0010
            .box h1 .span：0010 0001 0010
         */
        .box h1 .span {
            background-color: blue
        }
    </style>
</head>
<body>
<div class="box">
    <h1 id="h">
			<span class="span">
				<a href="">我是a标签</a>
			</span>
    </h1>
</div>
</body>
</html>
<!--
	行内式      权值：1000
	id选择器    权值：0100
	类名选择器、伪类选择器、属性选择器   权值：0010
	标签选择器、伪元素选择器          权值：0001
	通配符、子选择器、相邻选择器      权值：0000

	权重比较：
		每个选择器或者样式对应着四个值(权值): a b c d
		每组中的四个值从左往右，依次比较四个值的大小，值大的优先级高
		四个值一位一位的 比较，比较出来之后，后面的就不需要比较了

	!important声明的优先级最高
	优先级相同的话采取就近原则，谁离得近听谁的
	谁的层级深听谁的
	权值计算的前提是，层级深度一样
 -->