0.單行內容的居中
只考慮單行是最簡單的，無論是否給容器固定高度，只要給容器設定 line-hetikazcight 和 height，並使兩值相等，再加上 over-flow: hidden 就可以了
css code複製內容到剪貼簿
優點：（1）. 同時支援塊級和內聯極元素
（2）. 支援所有瀏覽器
缺點：（1）. 只能顯示一行
（2）. ie中不支援
等的居中
要注意的是：
（1）. 使用相對高度定義你的 height 和 line-height
（2）. 不想毀了你的布局的話，overflow: 一定要
為什麼？
請比較以下兩個程式設計客棧例子：
xml/html code複製內容到剪貼簿
上乙個高度是用的絕對單位px，並且沒有隱藏溢位，下乙個高度用的單位是相對單位em，並且隱藏了溢位。如果你的瀏覽器支援放大字型，那麼盡情地放大字型，看看會出現什麼效果。
1.使用position:absolute（fixed）,設定left、top、margin-left、margin-top的屬性;
css code複製內容到剪貼簿
2.利用position:fixed（absolute）屬性，margin:auto這個必須不要忘記了;
css code複製內容到剪貼簿
3.利用display:table-cell屬性使內容垂直居中;
css code複製內容到剪貼簿
4.使用css3的新屬性transform:translate(x,y)屬性;
css code複製內容到剪貼簿
5.最高大上的一種，使用:before元素;
css code複製內容到剪貼簿
6.flex布局;
css code複製內容到剪貼簿
本文標題: 結合css3的新特性來總結垂直居中的實現方法
本文位址:
CSS3新特性總結
1.屬性選擇器 常用的簡單歸納下 attribute value 用於選取帶有指定屬性和值的元素。title w3school attribute value 包含指定詞彙的元素。後代選擇器 title hello attribute value 用於選取帶有以指定值開頭的屬性值的元素，該值必須是整...
css3新特性總結
一 圓角邊框 border radius 5px 二 多背景圖 background url img flwr.gif right bottom no repeat,url gif left top repeat 三 顏色和透明度 由原來的rgb到現在的rgba background rgba 0,...
css3新特性總結
一 圓角邊框 border radius 5px 二 多背景圖 background url img flwr.gif right bottom no repeat,url gif left top repeat 三 顏色和透明度 由原來的rgb到現在的rgba background rgba 0,...