• 技术文章 >web前端 >前端问答

    CSS样式就近原则是什么

    长期闲置长期闲置2022-04-27 17:56:38原创213

    在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核实处理。
    专题推荐:css
    上一篇:css3选择器怎么选第几个 下一篇:jquery怎么增加兄弟节点
    VIP课程(WEB全栈开发)

    相关文章推荐

    • 【腾讯云】年中优惠,「专享618元」优惠券!• css3包含哪些模块• css3怎么改首字母颜色• css3如何实现鼠标点击图片放大• div css的布局较table布局有什么优点• css怎么实现带横线的箭头
    1/1

    PHP中文网