// 块级元素：div。P。Hi。Ul。Li，特点：垂直分布，宽度自适应，占满父元素的剩余空间
// 行级元素：span，a,img,input，style，特点：横着分布，不能设置宽高。宽度由内容撑开，但是img可以设置宽高
// 行内元素主要有：<span>、<a>、<b>、<img>、<br>、<button>、<strong>、<textarea>、<select>
// 块级元素主要有：<div>、<ul>、<li>、<p>、<fieldset>、<form>、<h1>、<h2>、<h3>、<h4>、<h5>、<h6>、<hr>、 <iframe>、<ol>、<pre>、<table>、<tr>、<td>
// 行内元素可以通过display:block转为块级元素。另外块级元素的margin和padding都正常，行内元素左右maring和左右padding正常，上下不识别，
// 也就是说不能通过margin-top和padding-top来改变行高。
