美文网首页
css继承_属性值计算

css继承_属性值计算

作者: 这样你就找不到我了 | 来源:发表于2022-01-10 09:58 被阅读0次

继承

子元素会继承父元素的某些CSS属性

通常,跟文字内容相关的属性都能被继承

属性值的计算过程

一个元素一个元素一次渲染,顺序按照页面文档的树形目录结构进行

渲染每个元素的前提条件:该元素的所有CSS属性必须有值

一个元素,从所有属性都没有值,到所有的属性都有值,这个计算过程,叫做属性值计算过程

如何计算:

  1. 确定声明值 无冲突
  2. 对有冲突值使用层叠规则(包括浏览器默认样式表)
  3. —对仍没有值的属性 若可以继承 则继承
  4. 对仍没有值的属性,使用默认值

强制继承:inherit

当想要继承父元素的值,而在第二步由于浏览器默认样式表或者其它原因,导致属性计算无法进行到第三步继承
可以用inherit强制继承 可以理解为声明了一个属性值。
对不能继承的属性,同样可以使用inherit强制继承。

    a{
        color: inherit;
    }

initial 设置为默认值

demo代码

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>css继承_默认值计算</title>
    
        <style>
            div {
                color: red;
            }
            a{
                color: inherit;
            }
        </style>
    </head> 
    <body>
        <div>
            <a href="#">
                我是红色吗?
            </a>
            <p>
                我是红色吗?
            </p>
        </div>
    </body>
</html>

相关文章

  • css继承_属性值计算

    继承 子元素会继承父元素的某些CSS属性 通常,跟文字内容相关的属性都能被继承 属性值的计算过程 一个元素一个元素...

  • CSS

    CSS规则 at 规则 CSS选择器 CSS选择器 继承与层叠 继承与层叠 CSS 属性 CSS 属性 CSS值 ...

  • CSS特性

    CSS属性的继承 CSS中有些属性是可继承的,何为属性的继承?一个元素如果没有设置某属性的值,就会跟随父元素的值当...

  • CSS继承

    继承属性:当元素的一个继承属性没有指定值时,则取父元素的同属性的计算值。 非继承属性:当元素的一个非继承属性没有指...

  • HTML第二天学习笔记

    1.CSS属性 可继承属性- 父标签的属性值会传递给子标签-一般是文字控制属性 不可继承属性- 父标签的属性值不能...

  • 30秒 学懂 css(二)

    计算属性calc() 函数calc()支持CSS3; 让你的CSS具有计算功能, CSS属性值就是表达式的结果 h...

  • 继承和层叠

    继承 CSS 中的祖先元素也会向后代传递一样东西:CSS 属性的值 有继承性的属性 1、字体系列属性 font:组...

  • CSS属性

    CSS属性 CSS有N多属性,根据继承性,主要可以分为2类。 可继承属性父标签的属性值会传递给子标签一般是文字控制...

  • HTML标签类型

    修改标签的显示类型 CSS属性 CSS属性-可继承属性 CSS属性-不可继承属性 CSS常用属性代码附录:

  • 样式

    集中设置元素属性 TargetType 样式 类似 css对属性值分组,在多个元素中共享该组的值效果 样式继承 本...

网友评论

      本文标题:css继承_属性值计算

      本文链接:https://www.haomeiwen.com/subject/wzwjcrtx.html