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>
相关推荐
inferno3 分钟前
CSS 基础(第二部分)
前端·css
BD_Marathon6 分钟前
Router_路由传参
前端·javascript·vue.js
闲云一鹤13 分钟前
Cesium 去掉默认瓦片和地形,解决网络不好时地图加载缓慢的问题
前端·cesium
Dreamcatcher_AC14 分钟前
前端面试高频13问
前端·javascript·vue.js
AI陪跑14 分钟前
深入剖析:GrapesJS 中 addStyle() 导致拖放失效的问题
前端·javascript·react.js
登山人在路上16 分钟前
Vue中导出和导入
前端·javascript·vue.js
消失的旧时光-194318 分钟前
Flutter 路由从 Navigator 到 go_router:嵌套路由 / 登录守卫 / 深链一次讲透
前端·javascript·网络
掘金酱22 分钟前
🏆2025 AI/Vibe Coding 对我的影响 | 年终技术征文
前端·人工智能·后端
智算菩萨24 分钟前
【Python基础】字典(Dictionary):AI的“键值对”信息存储的基石
前端·人工智能·python
C_心欲无痕31 分钟前
vue3 - shallowReadonly浅层只读响应式对象
前端·javascript·vue.js