块级元素，行内元素，行内块元素的区别以及转换

块级元素，行内元素，行内块元素

1、块级元素 block：自动占据一行，可以设置宽高。

常见：<div>, <h1-h6 ,p> ,<ul> , <li>, <form> ,<table>

其他元素转换为块元素：  display:block;

2、行内元素 inliine：相邻的行内元素排在同一行，排不下自动换行，宽度随元素内容而变，不可设置宽高。

常见：<span> , <img>, <a>， <br>

其他元素转换为块元素：  display:inline;

3、行内块元素 inline-block：跟行内元素相似，但是可设置宽高，元素间会有空白间隙，设置上一级font-size为0，可消除间隙。

常见：<button>, <img>, <input>, <select>, <label>,< textarea>

其他元素转换为行内块元素 ：display:inline-block;