css选择器的优先级

番茄西红柿发布于2019-04-23 13:27 / 2922人阅读

摘要：选择器的优先级表述为个部分，用表示。但是，在内部声明的选择器会影响优先级继承过来的样式没有优先级若存在通配选择器，则被其声明覆盖当两条相互冲突的带有规则的声明被应用到相同的元素上时，优先级更高的声明将会被采用。

选择器的优先级表述为4个部分，用0,0,0,0表示。

!important--1,0,0,0
行内样式
ID选择器--0,1,0,0
类选择器(例如,.example)、属性选择器（例如, [type="radio"]）或伪类（例如, :hover）--0,0,1,0
元素（例如, h1）和伪元素（例如, :before）--0,0,0,1
通配选择器(*), 关系选择符(+, >, ~, ) 和否定伪类(:not()) 对优先级没有影响。（但是，在 :not() 内部声明的选择器会影响优先级）--0,0,0,0
继承过来的样式没有优先级,若存在通配选择器，则被其声明覆盖

当两条相互冲突的带有 !important 规则的声明被应用到相同的元素上时，优先级更高的声明将会被采用。

GPU云服务器云服务器优先选择 css选择 css选择器基础选择器css

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/1901.html

重学前端学习笔记（二十二）--选择器的机制

摘要：优先级第一优先级无连接符号第二优先级空格第三优先级复杂选择器的连接符号空格表示选中所有符合条件的后代节点。后代表示选中符合条件的子节点。直接后继表示选中对应列中符合条件的单元格。笔记说明重学前端是程劭非（winter）【前手机淘宝前端负责人】在极客时间开的一个专栏，每天10分钟，重构你的前端知识体系，笔者主要整理学习过程的一些要点笔记以及感悟，完整的可以加入winter的专栏学习【...

acrazing 2019-08-02 16:18 评论0 收藏0
重学前端学习笔记（二十二）--选择器的机制

摘要：优先级第一优先级无连接符号第二优先级空格第三优先级复杂选择器的连接符号空格表示选中所有符合条件的后代节点。后代表示选中符合条件的子节点。直接后继表示选中对应列中符合条件的单元格。笔记说明重学前端是程劭非（winter）【前手机淘宝前端负责人】在极客时间开的一个专栏，每天10分钟，重构你的前端知识体系，笔者主要整理学习过程的一些要点笔记以及感悟，完整的可以加入winter的专栏学习【...

jeffrey_up 2019-08-26 13:52 评论0 收藏0
重学前端学习笔记（二十二）--选择器的机制

摘要：优先级第一优先级无连接符号第二优先级空格第三优先级复杂选择器的连接符号空格表示选中所有符合条件的后代节点。后代表示选中符合条件的子节点。直接后继表示选中对应列中符合条件的单元格。笔记说明重学前端是程劭非（winter）【前手机淘宝前端负责人】在极客时间开的一个专栏，每天10分钟，重构你的前端知识体系，笔者主要整理学习过程的一些要点笔记以及感悟，完整的可以加入winter的专栏学习【...

张汉庆 2019-08-30 10:56 评论0 收藏0
CSS 样式优先级

摘要：下面我们从这两方面去看看样式的优先级。影响的规则是优先规则最近的祖先样式比其他祖先样式优先级高。若同时插有，则再利用规则判断优先级。 CSS 样式优先级当创建的样式表越来越复杂时，一个标签的样式将会受到越来越多的影响，这种影响可能来自周围的标签，也可能来自其自身。下面我们从这两方面去看看 CSS 样式的优先级。 CSS 的继承性 CSS 的继承特性指的是应用在一个标签上的那些 CSS...

王晗 2019-08-28 18:19 评论0 收藏0
CSS优先级的及其衡量标准CSS权重

摘要：优先级是由权重来作为衡量标准的，权重的计算有一套计算公式，有如下规范使用一个位数的字串来表示级别，从左到右，左边的做大，往右依次递减，且数位之间没有进制，级别之间不可逾越。定义了一个命令，该命令被赋予最大的优先级。一、背景 CSS有三大特性：层叠性、继承性、优先级。而我们在给CSS定义样式的时候，经常出现两个及以上的规则应用在同一元素上，单该元素最终在浏览器呈现的效果是应用的哪个规则呢？这...

ky0ncheng 2019-04-23 13:28 评论0 收藏0