CSS all 属性

CSS all 属性

定义和使用

all 属性用于重置所有属性,除了 unicode-bidi 和 direction。

默认值: none
继承:
动画: no。 阅读 animatable
版本: CSS3
JavaScript 语法: object.style.all="initial"

属性值

描述
initial 修改所有元素属性或父元素的值为其初始化值
inherit 修改所有元素属性或父元素的值为其父元素的值
unset 修改所有元素属性或父元素的值为其父元素的值(如果有继承)或其初始值

演示代码

html 复制代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
<style> 
html {
  font-size: small;
  color: blue;
}

#ex1 {
  background-color: yellow;
  color: red;
}

#ex2 {
  background-color: yellow;
  color: red;
  all: inherit;
}

#ex3 {
  background-color: yellow;
  color: red;
  all: initial;
}

#ex4 {
  background-color: yellow;
  color: red;
  all: unset;
}
</style>
</head>
<body>

<p>没有 all 属性:</p>
<div id="ex1">学的不仅是技术,更是梦想!!!</div>

<p>all: inherit:</p>
<div id="ex2">学的不仅是技术,更是梦想!!!</div>

<p>all: initial:</p>
<div id="ex3">学的不仅是技术,更是梦想!!!</div>

<p>all: unset:</p>
<div id="ex4">学的不仅是技术,更是梦想!!!</div>

<p><b>注意:</b> Internet Explorer 和 Safari 浏览器不支持 all 属性。</p>

</body>
</html>
相关推荐
CL_IN1 小时前
企业数据集成:实现高效调拨出库自动化
java·前端·自动化
浪九天2 小时前
Vue 不同大版本与 Node.js 版本匹配的详细参数
前端·vue.js·node.js
qianmoQ3 小时前
第五章:工程化实践 - 第三节 - Tailwind CSS 大型项目最佳实践
前端·css
椰果uu3 小时前
前端八股万文总结——JS+ES6
前端·javascript·es6
微wx笑3 小时前
chrome扩展程序如何实现国际化
前端·chrome
~废弃回忆 �༄4 小时前
CSS中伪类选择器
前端·javascript·css·css中伪类选择器
CUIYD_19894 小时前
Chrome 浏览器(版本号49之后)‌解决跨域问题
前端·chrome
IT、木易4 小时前
跟着AI学vue第五章
前端·javascript·vue.js
薛定谔的猫-菜鸟程序员4 小时前
Vue 2全屏滚动动画实战:结合fullpage-vue与animate.css打造炫酷H5页面
前端·css·vue.js
春天姐姐5 小时前
vue3项目开发总结
前端·vue.js·git