对于css的继承有不了解的同学，我首先声明一下：

块级元素和内联级元素

块级元素：

①总是在新行上开始；

②高度，行高以及外边距和内边距都可控制；

③宽度缺省是它的容器的100%，除非设定一个宽度。

④它可以容纳内联元素和其他块元素

内联级元素：

①和其他元素都在一行上；

②高，行高及外边距和内边距不可改变；

③宽度就是它的文字或图片的宽度，不可改变

④内联元素只能容纳文本或者其他内联元素

其实，就是没有什么差异，比如，我们完全可以把内联元素加上display:block这样的属性，让他也有每次都从新行开始的属性即成为块元素，同样我们可以把块元素加上display:inline这样的属性，让他也在一行上排列。

‍ ‍ ‍ ‍ ‍ ‍ ‍ ‍ ‍ ‍ ‍

当然，有些元素是可变的，他会随紧跟的元素改变它的性质。

‍

‍继承的性质

继承的性质

之后我们还有明白一个道理，就是继承性。有些属性是没有继承性的，所以也谈不上继

承的性质。譬如：margin、border、padding、background、height、min-height、max-

height、width、min-width、max-width、overflow、position、left、right、top、 bottom、z-

index、float、clear、table-layout、vertical-align····

但是，我们可以参考父元素的标准。

例如：width:100%就要参考父元素了！

 

width:100%的举例

width:100%的举例

对于不存在其它关系的嵌套，width:100%是直接基于父级DIV的宽度（宽度要指定）。

对于使用position:relative的子类元素而言，width:100%也始终是基于基父级元素而并

不会基于其上层元素中的relative。

对于绝对定位的子无素，要是其外层的所有元素中都没有用position:relative，则width:100%是基于body，否则就是离基最近的一个position:relative的元素。

而对于position:fixed的元素，其一直是基于body,所以其宽度100%就是基于body。

内层子元素必须为块级元素，才有可能出现宽度继承

当父元素宽度确定，子元素不存在浮动，绝对定位，固定定位时，其宽度也能够很好的继承；相反，宽度会零（只有通过里面的内容把其撑开）。

当父元素宽度不确定时（宽度是继承而来，或是用的相对单位），不会对继承造成什么影响。其仍然满足上面的1、2两条。