CSS - 块元素，行内元素，行内块元素与显示模式的转换

1.块元素

div，p，h1，ol，ul，dl，tabel，form

块元素的特点：

1.独占一行

2.宽度 高度 内外边距 都可以控制

3.宽度默认是容器(父级容器)的100%

4.里面可以放 块元素，行内元素，行内块元素

5.特殊的 p标签与h1~h6标签 只能放文字

 

2.行内元素

span，a，strong，em，del，ins，i

行内元素的特点：

1.一行可以显示多个

2.宽高直接设置是无效的

3.默认宽度就是本身内容的宽度

4.只能容纳文本或其它行内元素

行内元素设置了浮动或者是定位 都可以直接设置宽高

 

3.行内块元素

img，input，td

行内块元素的特点：

1.一行可以显示多个，但是它们之间会有空白缝隙

2.默认宽度就是本身内容的宽度

3.宽度 高度 内外边距 都可以控制

 

4.显示模式的转换

/*转换为块元素*/
display: block;

/*转换为行内元素*/
display: inline;

/*转换为行内块元素*/
display: inline-block;