1.块级元素
1.总是从新的一行开始，即各个块级元素独占一行，默认垂直向下排列；
2.高度、宽度、margin及padding都是可控的，设置有效，有边距效果；
3.宽度没有设置时，默认为100%；
4.块级元素中可以包含块级元素和行内元素。
2.行内元素
1.和其他元素都在一行，即行内元素和其他行内元素都会在一条水平线上排列；
2.高度、宽度是不可控的，设置无效，由内容决定。
设置margin左右有效，有边距效果；
设置margin上下会撑大空间但是不会产生边距效果（即盒模型margin-top/bottom有值，但页面上没有边距效果）。
设置padding左右有效，设置padding上下会撑大空间但是不会产生边距效果（同上）。
简而言之：1.行内元素的padding属性只对元素的左、右有用,上、下无用(视觉上会产生效果,但其实设置的是无效的。并不会对他周围的元素产生任何影响。)
2.行内元素的margin属性只对元素的左、右有用,上下无用
3.行内块元素(融合了前两者的特点)
(1)不自动换行，与其他行内元素都会在一条水平线上排列；
(2)高度、宽度、margin及padding都是可控的，设置有效，有边距效果；
(3)默认排列方式为从左到右。
4.三个元素的转换
可以用 display 进行元素属性的转换
display: block; 转换为块元素
inline; 行内元素
inline-block; 行内块元素(和float连用的话会警告)
5.常用的行内元素
<a>、<strong>、<b>、<em>、<i>、<del>、<s>、<ins>、<u>、<span>、<br>、<input>、<label>、<select>、<textarea>、<button>
6.常用的块级元素
tarea>、
6.常用的块级元素
<h1>~<h6>、<p>、<div>、<ul>、<ol>、<li>、<dd>、<form>、<table>、<header>、<footer>、<address>、<article>、<hr>