HTML中的行内元素和块级元素区别和转换

常见行内元素：a、font、img、input、label、select、small、span、textarea

常见块级元素：center、div、ul、ol、li、form、hr、menu、p、table

1. 行内元素：在水平方向排列，不能包含块级元素，设置width、height无效(可以设置line-height)，margin、padding上下无效。
2. 块级元素：在垂直方向排列，占据一行，可以包含行内元素。
3. 块级元素的 width 默认为 100%，而内联元素则是根据其自身的内容或子元素来决定其宽度。

转换关系

1. display:block // 此元素将显示为块级元素，元素前后会带有换行符
2. display:inline // 默认。此元素会被显示为内联元素，元素前后没有换行符
3. display:inline-block // 行内块元素，既具有block的宽度高度特性又具有inline的同行特性