首页 >web前端 >前端问答 >CSS样式就近原则是什么

CSS样式就近原则是什么

WBOY
WBOY原创
2022-04-27 17:56:383561浏览

在css中,样式的就近原则指的是当多种不同的样式规则应用在同一元素上时,若样式权重相同,则靠近元素的样式具有最大的优先级;就近原则也可以理解为多种样式权重相同时,排在最后的样式优先级最大。

CSS样式就近原则是什么

本教程操作环境:windows10系统、CSS3&&HTML5版本、Dell G3电脑。

CSS样式就近原则是什么

CSS优先级

在复杂CSS样式表,往往并不是相同样式不同值的堆叠这么简单,经常出现两个或多个不同样式规则应用在同一元素上,这时到底采用哪个样式呢?这就是典型的CSS优先级问题。

处理优先级问题,就是考虑样式权重的高低。这里先给大家介绍一些特殊的情况:

==继承样式的权重为0。==也就是说,在嵌套结构中,无论父元素样式权重多大,子元素继承时,应用在子元素上的权重都为0,即子元素定义的样式会覆盖所有继承来的样式。

==行内样式优先。==应用style属性的元素,其行内样式的权重非常高,可以理解为远大于100。总之,他拥有比上面提高的选择器都大的优先级。

权重相同时,CSS遵循就近原则。也就是说靠近元素的样式具有最大的优先级,或者说排在最后的样式优先级最大。

CSS定义了一个!important命令,该命令被赋予最大的优先级。也就是说不管权重如何以及样式位置的远近,!important都具有最大优先级。

css权重

关于CSS权重,我们需要一套计算公式来去计算,这个就是 CSS Specificity,我们称为CSS 特性或称非凡性,它是一个衡量CSS值优先级的一个标准 具体规范入如下:

Specificity用一个四位的数字串(CSS2是三位)来表示,更像四个级别,值从左到右,左面的最大,一级大于一级,数位之间没有进制,级别之间不可超越。

03.png

(学习视频分享:css视频教程

以上是CSS样式就近原则是什么的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn