如何让css样式不继承或不传递

html-css05

如何让css样式不继承或不传递,第1张

第一点. 现在没有办法,都是从上到下读取的。

第二点.怎么解决呢.

如果同样的名称 是会继承传递的

只有想办法 class 加上id

比如 <div class="top" id="head"></div>

这样区别开来

或者

2.

<a class="top head"></a>

<a class="top body"></a>

<a class="top foot"></a>

这样 只给top共同属性~

然后不一样的属性 标注在 head body 和foot上面 就不会冲突了~

不可以被子元素继承的属性:

1、display:规定元素应该生成的框的类型

2、文本属性:

vertical-align:垂直文本对齐

text-decoration:规定添加到文本的装饰

text-shadow:文本阴影效果

white-space:空白符的处理

unicode-bidi:设置文本的方向

3、盒子模型的属性:width、height、margin 、margin-top、margin-right、margin-bottom、margin-left、border、border-style、border-top-style、border-right-style、border-bottom-style、border-left-style、border-width、border-top-width、border-right-right、border-bottom-width、border-left-width、border-color、border-top-color、border-right-color、border-bottom-color、border-left-color、border-top、border-right、border-bottom、border-left、padding、padding-top、padding-right、padding-bottom、padding-left

4、背景属性:background、background-color、background-image、background-repeat、background-position、background-attachment

5、定位属性:float、clear、position、top、right、bottom、left、min-width、min-height、max-width、max-height、overflow、clip、z-index

6、生成内容属性:content、counter-reset、counter-increment

7、轮廓样式属性:outline-style、outline-width、outline-color、outline

8、页面样式属性:size、page-break-before、page-break-after

9、声音样式属性:pause-before、pause-after、pause、cue-before、cue-after、cue、play-during

可以使用 CSS 的 all 属性。但是目前IE和Edge浏览器还没有任何版本兼容这个属性。所以实际开发中,如果需要兼容IE或者Edge的话,不能使用。同时安卓4.4以及以下,Safari9 的部分版本也不支持。

还是简单的说下用法:

all 属性可以重置选中元素的属性(除了direction和unicode-bidi两个属性)

all 属性在Cascading and Inheritance Level 3 规范中有三个可选的值

initial : 重置所有CSS属性为初始值

inherit : 元素继承所有服元素的CSS属性,即使有些属性原本不是可继承的

unset : 元素继承服元素所有可继承的属性

同时在 Cascading and Inheritance Level 4 规范草案中增加了 revert 值。由于还仅仅是草案,所以这里不细说,详情可以异步下面的链接。

W3C 相关标准内容:

https://www.w3.org/TR/css-cascade-3/#defaulting

https://drafts.csswg.org/css-cascade/#all-shorthand