HTML5中块级元素、行内元素和行内块元素都有什么如何转换、有何特点

块级元素、行内元素和行内块元素都有什么如何转换、有何特点

块级元素

常用的块级元素有：div , p , h1~h6 , ol , ul , dl , form , table , address …

特点：
每个块级元素都独占一行。
元素的宽度、高度、行高及顶部和底部边距可以设置。
元素宽度在不设置的情况下，和它父元素的宽度一致

行内元素

常用的行内元素有：span , br , a , em , b , i , strong …

特点：
和其它元素都在一行上。
元素的宽度、高度及顶部和顶部边距都不能设置。
元素的宽度就是它所包含的文字或图片的宽度，不可修改

行内块元素

常用的行内元素有：img , input , td

特点：
和其它元素都在一行上。
元素的宽度、高度、行高及顶部和底部边距可以设置。

三种元素之间的转换

变为块级元素（独占一行，可控）：display: block;
变为行内元素（不会独占一行，不可控）：display: inline;
变为行内块元素（可设置宽高，margin,padding）：display: inline-block;

总结