块级元素，行内元素，行内块元素以及转换

块级元素特点

• 独占一行

• 高度，宽度，外边距和内边距都可以控制

• 宽度默认是父级宽度的100%

• 里面可以放行内和块级元素

常见的块级元素有：div h1~h6 p ul li ol等

行内元素特点

• 相邻行内元素在一行上，一行可以显示多个

• 设置高宽度无效

• 默认宽度就算本身内容的宽度

• 行内元素只能容纳文本和其它元素

常见的行内元素有 a span strong b em i del s ins u 等

行内块元素特点

和相邻行内元素（行内块）在一行上，但之间会有空隙。一行可以显示多个（行内元素特点）

默认宽度就算它本身内容的宽度（行内元素特点）

宽度，高度，内外边距都可以控制（块级元素特点）

常见的行内块元素有 img input td

转换

通过 display 属性对进行类型转换：

display:none; /* 元素不显示 */

display:block; /* 元素以块级形式展示 */

display:inline; /* 元素以行内形式展示 */

display:inline-block; /* 元素以行内块形式展示 */

---