继承属性,其思想是 应用于某一个元素的一些属性值将由该元素的子元素继承,而有些不会。
例如:
-
font-family
和color
进行继承是有意义的,因为这可以让你很容易的设置一个站点内的所有元素基本字体。如果有特殊字体的话,再去单独设置。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
html,body{
font-family:'coloas'
}
#app {
font-family:'微软雅黑'
}
</style>
</head>
<body>
<p id="app">战胜id选择器的优先级只有 !important</p>
<script>
</script>
</body>
</html>
-
margin
padding
border
background-image
设计为不被继承是有意义的,你总不会想看到最外层的HTML设置了margin或者padding。而内部的元素都继承了没有意义的布局效果,我们还要单独的元素上取消他们。
控制继承
集成提供了四中特殊属性值
- [
inherit
]: 该值将应用到选定元素的属性值设置为与其父元素一样。 - [
initial
] initial 是将属性的初始值( initial value)赋给元素 . initial 适用于所有的css 属性(属性的initial值可在属性表中查到),包括css 简写属性(全局属性)all.") :该值将应用到选定元素的属性值设置为与浏览器默认样式表中该元素设置的值一样。如果浏览器默认样式表中没有设置值,并且该属性是自然继承的,那么该属性值就被设置为inherit
。 - [
unset
] "CSS 关键字 unset 的属性如果有继承父级样式,则将该属性重新设置为继承的值,如果没有继承父级样式,则将该属性重新设置为初始值。换句话说这个unset关键字会优先用inherit的样式,其次会应该用initial的样式。它允许应用任意的CSS样式,包括CSS速记 all 关键字。") :该值将属性重置为其自然值,即如果属性是自然继承的,那么它就表现得像inherit
,否则就是表现得像initial
。 - [
revert
] "此页面仍未被本地化, 期待您的翻译!") :如果当前的节点没有应用任何样式,则将该属性恢复到它所拥有的值。换句话说,属性值被设置成自定义样式所定义的属性(如果被设置), 否则属性值被设置成用户代理的默认样式。
网友评论