CSS关键字 unset

CSS关键字 unset 可以分为两种情况：

如果这个属性本来有从父级继承的值（这个属性默认可以继承，且父级有定义），则将该属性重新设置为继承的值，换句话说，这种情况下（继承属性）它的行为类似于inherit ；
如果没有继承父级样式，则将该属性重新设置为初始值，这种情况下（非继承属性）类似于initial。

<p>This text is red.</p>
<div class="foo"><p>This text is also red.</p>
</div>
<div class="bar"><p>This text is green (default inherited value).</p>
</div>.foo {color: blue;
}
.bar {color: green;
}p {color: red;
}
.bar p {color: unset;
}

说明如下：
1.第一个，p有声明属性，是红色；
2.第二个，p元素color本身是红色，则不用继承，是红色。
3.第三个，p声明属性有两个,根据选择器权重，color是unset，（color属性可以被继承），且父元素的color有值，则使用父元素的，则为绿色。
关于属性值的计算过程可以参照我的另一篇专门写css属性值计算过程的文章。

css属性值计算过程

CSS关键字 unset相关推荐

css关键字unset
今天遇到了一个css属性 display:unset 以为是新增的display的属性值,查了好久,发现并没有这个属性值, 后来发现了unset是css的关键字,将一个属性的属性值设置为unset,目 ...
谈谈一些有趣的CSS题目（十五）-- 谈谈 CSS 关键字 initial、inherit 和 unset
开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题 ...
CSS 关键字 initial、inherit 和 unset
经常会碰到,问一个 CSS 属性,例如 position 有多少取值. 通常的回答是 static.relative.absolute 和 fixed .当然,还有一个极少人了解的 sticky .其 ...
谈谈 CSS 关键字 initial、inherit 和 unset
经常会碰到,问一个 CSS 属性,例如 position 有多少取值. 通常的回答是 static.relative.absolute 和 fixed .当然,还有一个极少人了解的 sticky .其 ...
CSS 关键字 inherit 和 unset
我们看w3c文档,发现position的取值有static(默认值).relative.absolute 和 fixed .除此之外其实还有initial(默认).inherit(继承).unset ...
HTML、CSS、JavaScript常见面试问题的总结（css篇）
CSS 面试知识点总结目录 CSS 面试知识点总结问题一:介绍一下标准的 CSS 的盒子模型?低版本 IE 的盒子模型有什么不同的? 问题二: css选择器以及优先级? 问题三:::before ...
css点击字变颜色_使用CSS颜色关键字
css点击字变颜色 One of the two oldest methods of applying color to web pages, named colors remain very use ...
谈谈一些有趣的CSS题目（十七）-- 不可思议的颜色混合模式 mix-blend-mode
谈谈一些有趣的CSS题目(十七)-- 不可思议的颜色混合模式 mix-blend-mode 原文:谈谈一些有趣的CSS题目(十七)-- 不可思议的颜色混合模式 mix-blend-mode 开本系列, ...
谈谈一些有趣的CSS题目（十六）-- 奇妙的 background-clip: text
开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题 ...

CSS关键字 unset

CSS关键字 unset相关推荐

最新文章

热门文章