- 块状元素 display:block的特性是水平拉伸，垂直包裹，可以设置宽度和高度。块状元素还有个特性就是它的margin如果碰不到祖先元素的border或者padding，会与祖先元素垂直方向的margin-top、margin- bottom交叠。上下相邻的同级元素的margin也会交叠，就产生了margin合并。
- 内联元素 display:inline的特性的自动包裹，水平和垂直方向会自动包裹至内容的宽度。 因为元素的内联的，是嵌入到行里面 的，所以对内联元素垂直方向设置的margin-top、margin-bottom不会影响span元素的layout，但是水平方向设置的 margin-left、margin-right会影响内联元素的缩进。因为其具有自动包裹的特性，所以overflow属性无效。
- 内联块状元素display：inline-block， 除了具有内联元素自动包裹的特性外，还具有块状元素可以设置高度和宽度的特 性。内联块状元素还有一个重要的特性就是可以通过设置它的margin来改变其layout，但是内联块状元素的margin不与其他元素的margin 交叠。
- 常用的块状元素： <div><h1>-<h6><ul><ol><li><dl><dt><dd><hr><ul><p><tabel><thead><tbody><tfoot>
- 常用的内联元素： <a><b><i><span><em><label><strong><img><input><tr><th><td>
- display:block 支持padding,margin,width,height,float,overflow 等属性 @ 默认 100%; height:auto; overflow:hidden;
- display:inline 支持padding,margin-left,margin-right 等属性 @ 可以通过 display:block/ float:left 转换为块状元素。不同的是float会导致器改变对齐。
- display:inline-block 支持padding,margin,width,height,float,overflow 等属性
- IE6/IE7不识别display:inline-block属性
- div {display:inline; zoom:1;...}
- 即 {display:inline-block;} =={display:inline; zoom:1;} 后者兼容浏览器
- 内联元素不能包含块级元素。
- 比如 P 元素，只能包含内联元素，而不能包含块级元素。
以上纯属个人总结，如有错误或不完善的地方，请指点，必第一时间完善，十分感谢。