CSS选择器权重计算
CSS各种选择器的权重:
1.ID选择器 +100
2.类、属性、伪类选择器 +10
3.元素、伪元素选择器 +1
4.其他选择器 +0
如果有两个CSS样式都作用于某元素,如:
#id .link a[href] ----- #id(100) + .link(10) +a(1) + [href](0) = 111
#id .link.active ----- #id(100) + .link(10) + .active(10) = 120
显然,下面的权重比上面的高,那么如果有相同的样式属性,下面的会覆盖掉上面的
需要注意的是,如果有:
#id
.c1.c2.c3.c4.c5.c6.c7.c8.c9.c10.c11
即使下面的算出来的值要比上面的大,但是上面的优先级依然比下面的高
补充:
!important 的优先级最高;
内联样式比在样式表写的样式优先级高;
相同权重的后写的优先级更高
CSS选择器权重计算的更多相关文章
- 前端极易被误导的css选择器权重计算及css内联样式的妙用技巧
记得大学时候,专业课的网页设计书籍里面讲过css选择器权重的计算:id是100,class是10,html标签是5等等,然后全部加起来的和进行比较... 我只想说:真是误人子弟,害人不浅! 最近,在前 ...
- CSS 选择器权重计算规则
其实,CSS有自己的优先级计算公式,而不仅仅是行间>内部>外部样式:ID>class>元素. 一.样式类型 1.行间 <h1 style="font-size: ...
- CSS 选择器权重计算规则(转)
其实,CSS有自己的优先级计算公式,而不仅仅是行间>内部>外部样式:ID>class>元素. 一.样式类型 1.行间 <h1 style="font-size: ...
- CSS选择器权重计算规则
从CSS代码存放位置看权重优先级:内嵌样式 > 内部样式表 > 外联样式表.其实这个基本可以忽视之,大部分情况下CSS代码都是使用外联样式表. 从样式选择器看权重优先级:important ...
- css系列,选择器权重计算方式
CSS选择器分基本选择器(元素选择器,类选择器,通配符选择器,ID选择器,关系选择器), 属性选择器,伪类选择器,伪元素选择器,以及一些特殊选择器,如has,not等. 在CSS中,权重决定了哪些CS ...
- css选择器权重、样式继承、默认样式
学过css的小伙伴都是指css选择器的权重 !important Infinity 行间样式 1000 id 100 class|属性|伪类 10 标签|伪元素 1 通配符 0 权重相同 相同cs ...
- CSS选择器优先级计算
优先级从高到低排列,浏览器优先满足前面的规则 1,!important优先级最高 2,内联样式 3,作者>读者>浏览器 4,优先级权重加法 id选择器+100/个 类/伪类选择器+10/个 ...
- css选择器权重问题
important infinity 行间样式 1000(256进制) id 100 class/属性/伪类 10 标签/伪元素 1 通配符 0
- 常见CSS选择器的权重和优先级
一.常见CSS选择器 [元素选择器] 1.通配选择器:*(匹配所有元素) a.效率不高,页面上的标签越多,效率越低,所以页面上最好不要出现这个选择器 2.标签选择器:li(匹配标签为li的元素) a. ...
随机推荐
- YCD 软件更新方法
备份Messenger的数据库和Player的Chainmail数据 Upgrade process in Cnario is quite simple, uninstall old version ...
- [转帖]Sqlserver BCP 的用法
SQL Server中bcp命令的用法以及数据批量导入导出 http://www.cnblogs.com/xwdreamer/archive/2012/08/22/2651180.html 我这边使用 ...
- 为什么开源外围包安装指导都是按照到/usr/local/目录下,/usr/local与/usr的区别
很多应用都安装在/usr/local下面,那么,这些应用为什么选择这个目录呢?Automake工具定义了下面的一组变量: Directory variable Default value prefix ...
- linux 命令mkdir、cd
mkdir 创建文件夹 -p 递归创建文件夹 可以一次性创建多个目录 cd pwd 显示当前目录的绝对路径 rmdir 删除空目录 只能删除空目录 鸡肋,基本用rm cp 复制文件产品 -r ...
- BZOJ 2200 道路与航线 (算竞进阶习题)
dijkstra + 拓扑排序 这道题有负权边,但是卡了spfa,所以我们应该观察题目性质. 负权边一定是单向的,且不构成环,那么我们考虑先将正权边连上.然后dfs一次找到所有正权边构成的联通块,将他 ...
- 【BZOJ5496】[十二省联考2019]字符串问题(后缀树)
[BZOJ5496][十二省联考2019]字符串问题(后缀树) 题面 BZOJ 洛谷 题解 首先显然可以把具有支配关系的串从\(A\)到\(B\)连一条有向边,如果\(B_i\)是\(A_j\)的前缀 ...
- [bilibili]弹幕屏蔽列表
<filters> <item enabled="true">t=定单身</item> <item enabled="true& ...
- OpenLayers学习笔记(八)— 类似比例尺的距离环(二)
openlayers 3 地图上创建一个距离环,始终以地图中心为中心,每个环之间的距离类似比例尺,随地图缩放而变化. 添加具有覆盖整个范围的特征的虚拟层,其可以被设置为围绕地图中心的环. 这篇是上一篇 ...
- request对象的方法及其参数的传递
先设计一个简单的登录界面index.htm: <html><head><title>request的使用</title></head>< ...
- TypeError: 'NoneType' object is not subscriptable
运行,显示TypeError: 'NoneType' object is not subscriptable错误信息,原因是变量使用了系统内置的关键字list 重新定义下这个变量就好了