HTML中三种显示类型特征

HTML三种显示类型

1. 块级元素
2. 行内元素
3. 行内块元素

类型特征

块级元素特性：
block: (div/p/dl/form/h1-h6/ol/ul)

1. 独占一行
2. 高度由里面的元素撑开
3. 宽度默认100%(继承父元素宽度)
4. 可以设置外边距/内边距
5. 可以包裹其他任意元素
6. p标签不可包裹块级元素(只存放文本)

行内元素特性：
inline: (a/b/em/i/img/span)

1. 和其他行内元素处于同一行
2. 不支持宽高
3. 上下外边距无效，auto无效(不支持auto居中)
4. 内边距只对内联元素产生影响，无视块元素
5. 标签之间的空格解析
6. a标签能包裹块级元素(特殊、区域链接)

行内块元素特性(集合两种盒模型的特征)：
inline-block: (input)

1. 本质上是行内元素，具有行内元素的性质
2. 支持宽高
3. 上下外边距有效,auto无效(不支持auto居中)
4. 内边距只对内联元素产生影响，无视块元素
5. 标签之间的空格解析
6. img标签不是行内块元素(是行内元素,但是可以设置宽高，这源自于历史…)