之前寫過一篇關於：css左右居中對齊的文章，裡面提到的兩種方法其實也可以引申為垂直居中對齊。寫這篇文章是因為要相容ie6、ie7的問題，我們都知道一行文字時可以通過line-height來設定垂直居中，如果是多行這個肯定不行，而我的同事因為這個用了js來實現居中對齊，我覺得這是很難理解的。故而整理這篇文章。
html**：
前端開發部落格，專注前端開發和web教程
快捷入口：
5年的老部落格，一直致力於web開發
第一種：display:table的方法
.middle-box
.middle-inner
缺點就是不相容ie6、ie7.怎麼相容呢？·
當然是用另外一種相對定位和絕對定位的方式。
可以使用ie的特有的條件語法，不過我習慣用ie hack來寫。下面這個的**實現了水平垂直多行**（支援一行）居中對齊。目前測試ie、chrome和firefox均相容。**如下：
.middle-box
.middle-inner
.middle-inner p
以後遇到居中問題，這三句css就夠用了。更多的css3 flexbox、margin負值等相容性還需要**。
演示第二種方法：增加乙個空白標籤
html**：
前端開發部落格，專注前端開發和web教程
快捷入口：
5年的老部落格，一直致力於web開發
css**：
.middle-box
.middle-box p
.visible
演示：居中對齊
CSS多行文字垂直居中
今天需要將文字垂直居中，就是一行是垂直居中，多行也是垂直居中。效果如下 實現 同事提供 doctype html html head lang en meta charset utf 8 title title style listdiv listdivleft listdivleft span l...
CSS多行文字垂直居中
今天需要將文字垂直居中，就是一行是垂直居中，多行也是垂直居中。效果如下 實現 同事提供 doctype html html head lang en meta charset utf 8 title title style listdiv listdivleft listdivleft span l...
css布局 多行文字垂直居中
場景 父元素 高度固定，如何使其中的文字垂直居中？方法一 測試文字測試文字 測試文字 測試文字 測試文字 測試文字 測試文字 測試文字 結果截圖 關鍵樣式 父元素 這裡是div 設定和高度一致的 line height 這裡是200px 由後面的vertical align定義看，這是為了設定div...