CSS继承_html/css_WEB-ITnose

前面的话

  层叠样式表中最基本的一方面是层叠——冲突的声明通过层叠过程排序,并由此确定最终的文档表示,这个过程的核心是选择器及其相关声明的特殊性,以及继承机制。

 

立即学习“前端免费学习笔记(深入)”;

特殊性

  选择器的特殊性由选择器本身的组件确定。特殊性值表述为4个部分:

【1】内联样式 -> 1,0,0,0
【2】ID属性值 -> 0,1,0,0
【3】类属性值、属性选择或伪类 -> 0,0,1,0
【4】元素或伪元素 -> 0,0,0,1
【5】结合符和通配选择器 -> 0,0,0,0

  1. h1{} -> 0,0,0,1p em{} -> 0,0,0,2.grape{} -> 0,0,1,0*.bright{} -> 0,0,1,0p.bright em.dark{} -> 0,0,2,2#id121{} -> 0,1,0,0div#side *[href]{} -> 0,1,1,1

登录后复制

 

立即学习“前端免费学习笔记(深入)”;

重要性

  重要声明:在声明的结束分号之前插入!important来标志

 

立即学习“前端免费学习笔记(深入)”;

继承

  继承是从一个元素向其后代元素传递属性值所采用的机制。基于继承机制,样式不仅可以应用到指定的元素,还会应用到它的后代元素。继承的属性没有特殊性。
  [注意1]在HTML中,应用到body元素的背景样式可以传递到html元素
  [注意2]标签不会继承父元素的文本样式

 

立即学习“前端免费学习笔记(深入)”;

层叠

【1】按来源及重要性排序。读者!important > 创作人员!important > 创作人员 > 读者 > 用户代理
【2】按特殊性排序
【3】按出现顺序排序,一个声明在样式表或文档中越后出现,权重越大

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。

点点赞赏,手留余香

给TA打赏
共0人
还没有人赞赏,快来当第一个赞赏的人吧!
    编程技术

    CSS单位_html/css_WEB-ITnose

    2025-3-29 9:49:20

    编程技术

    1.深入理解盒子模型_html/css_WEB-ITnose

    2025-3-29 9:49:27

    0 条回复 A文章作者 M管理员
    欢迎您,新朋友,感谢参与互动!
      暂无讨论,说说你的看法吧
    个人中心
    购物车
    优惠劵
    今日签到
    私信列表
    搜索