HTML行内元素、块状元素、行内块状元素的区别

　　HTML可以将元素分类方式分为行内元素、块状元素和行内块状元素三种。首先需要说明的是，这三者是可以互相转换的，使用display属性能够将三者任意转换：

　　(1)display:inline;转换为行内元素

　　(2)display:block;转换为块状元素

　　(3)display:inline-block;转换为行内块状元素

知道了行内元素和元素和快级元素的区别

• 区别一：

  • 块级：块级元素会独占一行，默认情况下宽度自动填满其父元素宽度

  • 行内：行内元素不会独占一行，相邻的行内元素会排在同一行。其宽度随内容的变化而变化。

• 区别二：

  • 块级：块级元素可以设置宽高

  • 行内：行内元素不可以设置宽高

• 区别三：

  • 块级：块级元素可以设置margin，padding

  • 行内：行内元素水平方向的margin-left; margin-right;

  padding-left; padding-right;可以生效。但是竖直方向的margin-bottom; margin-top; padding-top; padding-bottom;却不能生效。

• 区别四：

  • 块级：display:block;

  • 行内：display:inline;