css revert
时间: 2023-11-19 07:51:38 浏览: 49
`revert` 是 CSS 中的一个关键字,它可以用于重置某个属性的值为其父元素的值。具体来说,如果一个元素的某个属性被设置了值,而它的父元素也设置了相同的属性,那么这个元素可以使用 `revert` 关键字将该属性的值重置为其父元素的值。
例如,如果一个 `div` 元素的 `color` 属性被设置为红色,而它的父元素也设置了 `color` 属性为蓝色,那么可以使用 `color: revert;` 将该元素的文本颜色重置为蓝色。
需要注意的是,`revert` 关键字只能用于继承属性,不能用于非继承属性。
相关问题
font-size: revert;
`font-size: revert;`是CSS中的一个属性值,用于将元素的字体大小重置为其父元素的字体大小。当应用`font-size: revert;`时,元素的字体大小将恢复为继承自父元素的字体大小。
范例:
```html
<style>
.parent {
font-size: 20px;
}
.child {
font-size: revert;
}
</style>
<div class="parent">
<p class="child">这是一个段落</p>
</div>
```
在上面的例子中,父元素的字体大小为20px,而子元素应用了`font-size: revert;`,所以子元素的字体大小将恢复为20px。
ul list-style revert兼容性
`list-style` 属性的 `revert` 值是 CSS3 中新增的值,它会重置列表项的样式为浏览器默认样式。然而,由于它是 CSS3 的新值,因此在一些较老的浏览器上可能不被支持。
可以使用以下方法来解决 `revert` 值的兼容性问题:
1. 使用浏览器默认样式覆盖列表项样式:
```css
ul {
list-style: none;
}
li {
display: list-item;
text-indent: -1em;
}
```
这个方法会将列表项的显示方式设置为默认的 `list-item`,并使用负缩进来隐藏默认的标志。这种方法可以在所有浏览器上使用,但是在一些浏览器上可能会产生不同的显示效果。
2. 使用 CSS reset 或 normalize 库来统一不同浏览器的默认样式。
这些库会将所有元素的默认样式重置为一致的值,从而避免了不同浏览器之间的差异。常用的 CSS reset 库有 Eric Meyer's Reset CSS 和 Yahoo's YUI Reset CSS。
总之,如果需要使用 `list-style: revert`,可以先在现代浏览器中测试其效果,然后再根据需要选择使用适当的兼容性方案。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
<style type="text/css"> #navigation{ /*不需要设置宽度*/ font-family:Arial; } #navigation ul{ list-style-type:none; margin:0px; padding:0px; } #navigation li{ position: relative; float:left; top:490px; left: 900px; /***将项目列表转成水平显示***/ } #navigation li a{ display:block; /*将a元素转成块元素,目的是当鼠标进入该块的任何部分时都会被激活。*/ border:1px solid #0979c4; padding:3px 6px 3px 6px; margin:2px; text-decoration:none; text-align: center; } #navigation li a:link,#navigation li a:visited{ background-color: #0979c4; color:#ffffff; } #navigation li a:hover{ background-color:#0979c4; color:#87CEFA; } .b1{ all: revert; } </style> 桂电新闻 05-10 校长徐华蕊率队到浙江三所研究院调研(图) 校园快讯 学院动态 媒体桂电 如何让的内容不继承li的样式
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)