display:block和display:inline的区别

block元素特点：
1、处于常规文档流中，如果没有设置width属性，会自动填充父类容器。
2、可以应用外边距margin、内边距padding。
3、在没有设置高度的情况下，会扩展高度，以包含常规文档流中的子元素。
4、总是在新行开始。
5、忽略vertical-align。
inline元素特点：
1、不会在元素前后换行，水平方向上依次布局。
2、宽度由元素内容决定。
3、margin、padding在垂直方向上无效。
4、非替换元素的高度由line-height决定。
5、浮动或定位时，转为inline-block。
6、vertical-align属性生效