重新认识CSS的权重
作者:ghost 来源:css森林 时间:2011-05-24 17:06:00
今天 大白 问了一个关于CSS权重的问题:
关于选择器权重的问题 。class的权重是10 标签权重是 1 。比如说 p span{} 权重是2. 如果11标签自选择器的组合的权重11,会不会覆盖 一个class选择器权重10的 样式?
在跟他的讨论中,重新整理了我对CSS权重的理解。
在《 样式的作用域──页面重构中的模块化设计(一) 》中有做过总结,其中提到比较重要的两点:
权值的大小跟选择器的类型和数量有关
样式的优先级跟样式的定义顺序有关
在《 继承──页面重构中的模块化设计(三) 》的评论中 operafans 也提到了标签选择器的权值永远都比一个类选器择器的权值低,无论有多少个但一直以来都还是没能想通。
其实规则很简单: 比较同一级别的个数,数量多的优先级高,如果相同即比较下一级别的个数 ,至于各级别的优先级,大家应该已经很清楚了,就是:
important > 内联 > ID > 类 > 标签 | 伪类 | 属性选择 > 伪对象 > 继承 > 通配符
这也就解释了为什么11个标签的定义会比不上1个类的定义,1个类加11个标签会比不上2个类的权重高。
原文:http://www.cssforest.org/blog/index.php?id=185
标签:权重,CSS
0
投稿
猜你喜欢
4个场景教会你Go中Goroutine和通道是怎么用的
2024-04-23 09:45:05
python IP地址转整数
2023-06-08 22:38:25
Vue 搭建Vuex环境详解
2024-04-10 13:48:59
通过javascript进行UTF-8编码的实现方法
2024-04-16 10:39:49
微信小程序使用npm支持踩坑
2024-04-22 13:07:40
python通过BF算法实现关键词匹配的方法
2022-10-19 03:56:37
Python wxPython库Core组件BoxSizer用法示例
2023-01-17 23:08:32
mysql中的mvcc 原理详解
2024-01-18 05:10:13
7个好用的TypeScript新功能
2024-04-23 09:04:00
vue3中cookie的详细使用过程
2024-04-30 08:45:05
Opencv实现计算两条直线或线段角度方法详解
2023-10-01 22:18:15
Ubuntu下mysql安装和操作图文教程
2024-01-25 15:53:30
Python的Bottle框架的一些使用技巧介绍
2022-11-10 08:05:35
Pytorch 实现冻结指定卷积层的参数
2023-05-22 07:27:21
Python画图常用命令大全(详解)
2023-04-17 15:20:16
24个实用JavaScript 开发技巧
2024-04-10 11:03:39
Python实现日志实时监测的示例详解
2023-01-06 15:48:29
pandas读取excel时获取读取进度的实现
2022-03-24 09:57:26
如何利用Python 快速找到最大文件
2021-08-06 23:22:47
编写PHP脚本使WordPress的主题支持Widget侧边栏
2023-11-23 20:27:13