一、display

1、块元素

独占一行，可以设置width、height以及四个方向的margin，不设置width、height时，高度被子元素撑开，宽度为父元素宽度，内部可容纳其他块或行内元素。

2、行内元素

不独占一行，可以设置width、height以及左右方向的margin，不设置width、height时，高度宽度被子元素撑开，内部可容纳其他行内元素。

3、行内块元素（img、input）

不独占一行，可以设置width、height以及四个方向的margin。

对于块元素，IE6/7不能识别display:inline-block，要用*display:inline-block;*zoom:1代替

间距：

间距如何产生的？

我们在书写标签的时候，为了代码的简洁直观会换行，但是浏览器在解析的时候会把这个换行解析成一个字符，就是所谓的间距，如果我们不换行，那当然也不会有间距了。

解决方案

（1）移除标签间的空格

（2）把span标签的结束标签去掉，这样间隙就没有了。为了兼容IE6/IE7，最后一个标签需要闭合。（美团webapp页面也使用了这种方法）

（3）使用margin负值

（4）在父元素上加上font-size：0❤❤❤

（5）使用letter-spacing

4、none

①配合JavaScript动态隐藏元素，隐藏后不占据位置，隐藏内容会被浏览器忽略

5、table-cell（不兼容IE6/7）

可以让元素以单元格形式呈现

功能：

①图片垂直居中于元素

垂直居中

②等高布局

单元格高度相等，高度由内容撑开，且为n个元素中最高高度

③自动平均划分宽度