單行文字
可能很多人都知道如何讓單行文字垂直居中顯示，就是使用line-height，將line-height值與外部標籤盒子的高度值設定成一致就可以了。例如如下css**：height:3em; line-height:3em; ……
line-height:40px;height:40px;
多行文字
如何實現父容器高度固定，文字可能一行，兩行或更多行的垂直居中對齊呢？
實現的關鍵是把
文字當處理
。用乙個span標籤將所有的文字封裝起來，設定文字與相同的display屬性（inline-block屬性），然後用處理垂直居中的方式處理文字的垂直居中即可。
核心css**如下，
外部div標籤：
divspan在ie8以上的瀏覽器都顯示正常，但是在ie6 和ie7上面都不能正常顯示，於是我哭死在廁所
本以為可以很自豪的解決，今天一測試，竟然有bug啊啊啊
看下bug的效果圖
於是開始解決bug
**修改如下
對一段多行的文字看乙個整體，有三層的關係，進行**的修改
這個**看著更清新一點：
這是很多文字只是很多文字這是很多文字...
.middle-box
.middle-inner
.middle-inner p
附帶一張醜圖
大小不固定，多行文字的垂直居
1 垂直居中 父元素高度確定的單行文字 設定父元素的height和line height高度一致注 height是指該元素的高度，line height是指行間距。line height與font size的計算值之差，在css成為行間距，分為兩半，分別加到乙個文字行內容的頂部和底部。弊端 當文字長...
多行文字垂直居中
單行文字垂直居中比較簡單，只需將 line height 屬性值與其父元素的 height 屬性值設為相等即可。如下所示 class text 這是第一段文字span class text 這是第二段文字span class text 這是第三段文字span class text 這是第四段文字sp...
多行文字的垂直居中
與其他一些display屬性類似，table cell同樣會被其他一些css屬性破壞，例如float,position absolute，所以，在使用display table cell與float left或是position absolute屬性盡量不用同用。設定了display table c...