html 元素转换,HTML 元素之间的转换

display关键字

块状元素的特点：

1、总是另起一行(特立独行)

2、可以设置其宽度、高度，内外边距

3、在不手动设置宽度的情况下，宽度默认为所在容器的100%(即容器宽度)

4、可以容纳行内元素和其他块元素。

块级元素：

div、p、h1~h6、ul、li、ol、dd、dt、dl、table、hr、blockquote、address、pre、menu

HTML5中新增的：header、footer、aside、section

行内元素的特点：

1、总是和相邻的行内元素在同一行上(物以类聚)

2、设置宽高无效，水平方向的padding和margin属性可以设置，但是垂直方向上的无效。

3、默认宽度是他自身内容的宽度。

4、行内元素只能容纳其他行内元素或者文本。

常见的行内元素：

span、img、input、a、label、button、select、textarea、sup、sub、abbr、s、i、em、u、strong、small

行内块元素的特点：

1、和相邻行内元素在同一行，但是之间会有空白缝隙。

2、默认宽度是他本身内容的宽度。

3、宽度、高度、行高、外边距以及内边距都可以手动设置。

CSS：

强制转换成块元素

display：block

强制转换成行内元素

display：inline

强制转换成行内扩张元素

display：inline-block