原網頁：http://blog.163.com/axing0_0/blog/static/71205878200911103444626/
1.單行文本垂直居中
如果一個容器中只有一行文字，對它實現居中相對比較簡單，我們只需要設置它的實際高度height和所在行的高度line-height相等即可。
例如：
div {
height:30px;
line-height:30px;
overflow:hidden;
}
這段代碼很簡單，後面使用overflow:hidden的設置是爲了防止內容超出容器或者產生自動換行，這樣就達不到垂直居中效果了。
【注意】在Internet Explorer 6及以下版本中，這種方法不支持對圖片設置垂直居中。
2.多行未知高度文字的垂直居中
如果一段內容，它的高度是可變的，那麼我們就可以設定Padding，使上下的padding值相同即可。同樣的，這也是一種“看起來”的垂直
居中方式，它只不過是使文字把<div>完全填充的一種方式而已。可以使用類似下面的代碼：
div {
width:400px;
border:1px solid #00CCFF;
height:auto;
padding:25px;
}
【注意】高度必須是可伸縮的。
3.多行文本固定高度的居中
在Internet Explorer 6及以下版本中，在高度的計算上存在着缺陷的。在Internet Explorer 6中對父元素進行定位後，如果再對子元素
進行百分比計算時，計算的基礎似乎是有繼承性的（如果定位的數值是絕對數值沒有這個問題，但是使用百分比計算的基礎將不再是該元素的
高度，而從父元素繼承來的定位高度）。例如，我們有下面這樣一個(X)HTML代碼段：
<div id="wrap">
<div id="subwrap">
<div id="content">
</div>
</div>
</div>
如果我們對subwrap進行了絕對定位，那麼content也會繼承了這個屬性，雖然它不會在頁面中馬上顯示出來，但是如果再對content進行相
對定位的時候，你使用的100%分比將不再是content原有的高度。例如，我們設定了subwrap的position爲40%，我們如果想使content的上邊緣
和wrap重合的話就必須設置top:-80%;那麼，如果我們設定subwrap的top:50%的話，我們必須使用100%才能使content回到原來的位置上去，但
是如果我們把content也設置50%呢？那麼它就正好垂直居中了。所以我們可以使用這中方法來實現Internet Explorer 6中的垂直居中：
div#wrap {
border:1px solid #FF0099;
background-color:#FFCCFF;
width:760px;
height:400px;
position:relative;
}
div#subwrap {
position:absolute;
top:50%;
}
div#content {
position:relative;
top:-50%;
}