• 层叠机制和继承的概念以及CSS中选择器的优先级


    层叠机制:

      一个元素的某个特定的样式属性可能来自行间的style属性、内联样式表或者外部引入的样式表,以及浏览器自定义的样式,还有就是继承自父元素的样式,但是最终只会选择其中的某一个来表示,这个选择的过程就被称为层叠(cascading)。

    继承机制:

      在继承机制中,样式不仅会应用到指定的元素,还会应用到它的后代中没有设置特定样式的元素,他的后代元素的样式就是继承自它父级的样式,但是不是父级所有的样式都会被继承,一般关于文字的样式都会被继承下来。

    选择器的优先级:

      !important>行内样式>id选择器>类选择器>元素选择器>通配符>继承

      内嵌样式的个数 id选择器的个数 类选择器的个数 元素选择器的个数
    行内样式 1 0 0 0
    id选择器 0 1 0 0
    类选择器、伪类选择器 0 0 1 0
    元素选择器、伪元素选择器 0 0 0 1
    通配符 0 0 0 0
    !important 最高 最高 最高 最高

      优先级的计算方法:权重;(0,0,0,0)

      第一个0表示内嵌的个数,第二个表示的是id选择器的个数,

      第三个是类选择器的个数,第四个是元素选择器的个数,

      然后多个选择器组合后的优先级就是权重,层叠样式会选择权重大的。

      即元素的样式会由权重最大的选择器里面设置的属性决定。

  • 相关阅读:
    mybatis技术总结
    eclipse与idea部署项目的区别
    jQuery基础总结
    html页面加载顺序
    JavaScript高级技术总结
    JavaScript基础技术总结
    Node.js 从零开发 web server博客项目[数据存储]
    Node.js 从零开发 web server博客项目[koa2重构博客项目]
    Node.js 从零开发 web server博客项目[安全]
    Node.js 从零开发 web server博客项目[日志]
  • 原文地址:https://www.cnblogs.com/hg845740143/p/12045413.html
Copyright © 2020-2023  润新知