块级元素与行内元素

常见块级元素有：html、body、div、header、footer、nav、section、aside、article、p、hr、h1~h6、ul、ol、dl、form、table、tbody、thead、tfoot、tr等；

常见行内元素有：span、a、img、textarea、button、input、br、label、select、canvas、progress、cite、code、strong、em、audio、video等

行内块级元素(inline-block)：input、img、textarea

块级元素：会自动换行，在横向充满其父元素的内容区域，默认独占一行的，可修改宽高；

行内元素：不会自动换行，行内元素左右可以有其他元素，行内元素的宽高大多是auto*auto。；

行内元素设置宽高无效（但是行内置换元素可以设置宽高，下面有详细解释）、设置上下margin无效，设置上下padding类似无效（不影响文档流排列）

行内元素怎么样可设置宽高

使用display:block;和display：inline-block;样式可以实现转换为块级元素和行内块级元素（可设置宽高的行内元素），行内元素还可以通过添加float来设置宽高，因为不论什么元素本身是什么，当它浮动时就会生成一个块级框；

img属于行内替换元素。height/width/padding/margin均可用。效果等于块元素。
行内非替换元素，例如, height/width/padding top、bottom/margin top、bottom均无效果。只能用padding left、right和padding left、right改变宽度。