CSS中属性可以继承及不可继承详解

html-css024

CSS中属性可以继承及不可继承详解,第1张

一、不能继承的属性

① 盒子模型所有属性:margin、padding、border、width、height。

② 轮廓及背景属性:outline、background。

③ 定位、显示、浮动属性:display、position、top、left、right、bottom、max-*(如max-height等)、overflow、clear、float、content、z-index。

④ 其他:vertical-align、text-decoration、text-shadow、white-space。

注意:内联元素不能继承:text-indent和text-align,但是块级元素可以。

二、元素可继承属性

① 所有元素可继承:visibility、cursor。

② 列表元素可继承:list-style、list-style-type、list-style-position、list-style-image。

③ 字体属性:line-height、color、font、font-family、font-size、font-style、font-variant、font-weight、font-size-adjust。

④ 文本属性:text-transform、direction,除了(text-decoration、text-shadow 内联元素不能继承 ) 块级 可继承。

⑤ 表格布局属性:caption-side、border-collapse、border-spacing、empty-cells、table-layout。

⑥ 其它属性:letter-spacing、word-spacing。

如果还有您知道的,希望可以留言补充。

如果喜欢,不要吝啬你的爱心“❤”哦!

三大特性:层叠性、继承性、优先级

相同选择器给设置相同的样式,此时一个样式就会覆盖(层叠)另一个冲突的样式。层叠性主要解决样式冲突问题。

在这里会显示的颜色为pink,字体大小为20px。

子标签会继承父标签的某些样式

在这里p标签会显示红字,20px。

行高的继承

当同一个元素指定多个选择器,就会有优先级的产生

p为白色因为继承权重为0,无论父类是什么权重都不继承。

所以如果要给a设置样式就要单独设置一个a的样式。

这里显示的为蓝色,因为权重大。

最终大猪蹄子的颜色为红色,大肘子和猪尾巴为蓝色。