居中（水平居中+垂直居中）

一、水平居中。
1.最普通的（在视口或窗口中）水平居中。
先写一个div，给它一些基本样式。

此时只用设置一个属性：margin，

就得到了居中的结果（没错，这就是凝胶物布局，此方法必须设置元素的width）。
2.居中一个绝对定位的元素。
上述方法的元素使用默认的定位，即static，那么当元素是绝对定位（absolution）时，就用到了这个公式：
left=(x-y)/2.
x=parent width
y=element width

(x-y)/2=(300-100)/2=100
于是另class为box的元素的left:100px;即可另其水平居中。
3.居中一个宽度不定的元素。
以上两个方法的父元素宽度必须确定，那么当父元素的宽度不确定时，就可用此方法。公式：
x=child width;
y=x/2;
设置：
left:50%;
margin:0 0 0 -y;


当然，此方法也可用于子元素的宽度也不确定时：


二、垂直居中。
1.把元素显示方式设置为表格，如此就可用表格的vertical-align属性。

2.和水平居中的方法3类似，将元素的top设为50%，margin-top设为负的content高度的一半（如果padding不为0，那么margin-top为负的content和padding的和的一半），height必须给定。
因为高度固定，所以内容可能溢出，此时可以设置overflow:auto;这样当内容太多，就会出现滚动条。
3.和水平居中的方法1类似，设置position:absolution;（注意：若只是设置水平居中，并不需要设置position为absolution）把它从流中抽离出来，设置宽高，设置top:0;bottom:0;margin:auto;如此便能居中。

对于这个方法为何能居中，我个人的理解是，因为元素有一定的高度，设置top:0;bottom:0;并不能使上下距离都为0，于是设置了margin:auto;后为同时满足top和bottom的要求，就只能使其居中（两边一样距离，公平、不偏心，就是这么通俗易懂(^__^) ）
4.单行为本中，把文本所在元素的line-height设置为该元素的height即可。仅仅适用于单行文本。可以用于小元素如按钮文本或单行文本居中。
5.在要居中的元素前面再加一个元素（不是嵌套关系，而是同级关系），让此元素高度为视口的一半，再设置其margin-bottom为负的要居中元素的高度的一半。

注：目前只想到这些，以后再想到会接着补充，也欢迎大家补充~