块元素和行内元素的区别

什么是块元素，行内元素

块元素

特点

（1) 总是从新行上开始，即独占一行
（2）可以对它设置宽高和内外边距
（3）默认是它容器（父级元素）的100%
（4）可以容纳其他块级元素和行内元素（内联元素）

常见的块元素

<div>，<h1>~<h6>，<tr>，<td>，<ul>，<lo>…等

行内元素

特点

（1) 相邻行内元素在一行上，一行可以显示多个。
（2) 高、宽直接设置是无效的。
（3) 默认宽度就是它本身内容的宽度。
（4) 行内元素只能容纳文本或其他行内元素。

常见的行内元素

< a >、< b >、< u >、< span >、< img />、< input />、< select >…等，

区别

（1）块元素独占一行而行内元素一行可以显示多个，可以使用display:inline-block让块元素实现一行多个
（2）行内元素不能设置宽高，可以使用display:inline-block显示属性给行内元素设置宽高
（3）块元素自动换行，行内元素不会自动换行可以使用<br>等标签实现