栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

all:unset和all:revert之间有什么区别

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

all:unset和all:revert之间有什么区别

从MDN:

如果未设置CSS关键字从其父级继承,则将其重置为继承的属性,如果不是,则将其重置为初始值。换句话说,

inherit
在第一种情况下,其行为类似于
initial
关键字,在第二种情况下,其行为类似于关键字。

所以,

unset
要么是
inherit
initial

CSS CSS关键字revert将属性的级联值从其当前值恢复为该属性应 具有 的值( 如果当前样式原点未 对当前元素
进行任何更改) 。因此,如果该属性从其父级继承,则将其重置为继承的值,或者重置为由用户代理的样式表(或如果存在的话,由用户样式)建立的默认值。

假设浏览器将默认样式应用于您的元素。使用

revert
,您将放回那些样式,而
unset
不会。

例:

p {  margin: 50px;}<p >  some text here</p><p >  some text here</p>

在上面的示例中,还原操作将清除

50px
边距并放回浏览器应用的默认边距。在第二种情况下,未设置只会将边距设置为
initial
(即
0
)。

并非所有浏览器都支持还原值:https :
//caniuse.com/#feat=css-revert-value


如果未应用默认样式,

revert
则其行为与
unset

在许多情况下,revert关键字的工作原理与未设置的关键字完全相同。唯一的区别是属性 具有由浏览器或用户创建的自定义样式表
(在浏览器侧设置)设置的值。


all
是所有属性的简写,因此上述相同的逻辑适用于每个属性。


更多示例:

p {  margin: 50px;  border:1px solid blue;}.box {  color: red;  display:unset;}p {  color:unset;   display:inline-block;}<div >  <p >    some "block" text that should have no border and default browser margin  </p>  <p >    some "inline" text that should have no border and no margin  </p></div>


转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/615321.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号