HTML 行内元素、块级元素、行内块级元素区别

1. 行内元素( display: line )

 (1) 可以与其他非块级元素同在一行
 (2) 当多个行内元素占满一行时, 不会自动换行
 (3) 无法设置宽、高、行高
 (4) 无法设置上外边距（ margin-top ）
 (5) 常见行内元素： span、a

2. 块级元素( display: block )

 (1) 独占父容器的一行
 (2) 可以设置宽、高、行高
 (3) 默认宽度为父级元素宽度的 100%
 (4) 可以设置外边距（上下左右）
 (5) 常见块级元素： div、p

3. 行内块级元素( display: inline-block )

 (1) 可以与其他非块级元素同在一行
 (2) 当多个行内元素占满一行时, 不会自动换行
 (3) 可以设置宽、高、行高
 (4) 可以设置外边距（上下左右）
 (5) 常见行内块级元素： img、button