CSS3的元素显示模式有哪些及显示模式转换方法

元素显示模式就是元素（标签）以什么方式进行显示，比如div标签自己占一行，一行可以放多个span标签。

HTML元素分为块元素、行内元素、行内块元素。

常见的块元素有：h1-h6、div（最典型）、p、ol、ul、li等。

块元素独占一行。

高度、宽度、外边距、内边距都可以控制。

宽度默认是容器（父级宽度）的100%。

是一个容器及盒子，里面可以放行内或者块级元素。

文字类的块元素内不能使用块级元素，如h1-h6 和 p 标签，里面不能放其他类型的块级元素。

常见的行内元素有：a、strong、em、del、ins、b、i、u、span（最典型）等。

相邻行内元素在一行上，一行可以显示多个行内元素。
宽、高直接设置是无效的。
默认宽度就是它本身内容的宽度。
行内元素只能容纳文本和其他行内元素。

注意

链接里面不能再放链接。

特殊情况下a标签中可以放块级元素，但给a标签转换一下块级模式最安全。

在行内元素中有几个特殊的标签，img、input、td，它们同时具有行内元素和块元素的特点。

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

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

宽度、行高、外边距、内边距都可以控制（块元素特点）。

特殊情况下，我们需要元素模式的转换，比如要增加a标签链接的触发范围。
转换为块元素：display:block;

转换为行内元素：display:inline;

转换为行内块：display:inline-block;