要讓div中的內容垂直居中，無非有以下幾種方法，等我一一枚舉：如果要垂直居中的只有一行或幾個文字，那它的製作最為簡單，只要讓文字的行高和容器的高度相同即可，比如：p這段**可以達到讓文字在段落中垂直居中的效果。另一種方法和行高法很相似，它同樣適合一行或幾行文字垂直居中，原理就是利用padding將內容垂直居中，比如：p這段**的效果和line-height法差不多。模擬**法其實就是用css中對元素的宣告讓塊元素像**一樣顯示，用到的css屬性有display、vertical-align等。 先看下面的html**：居中顯示參照以上html**，讓最外面名為box的div呈**樣式顯示，然後再讓box中名為content的div呈單元格顯示，並利用vertical-align:middle讓其垂直居中，這樣就模擬出來和**一樣的顯示方式，css**如下：#wrap #content但這種方法有乙個弊端，由於ie瀏覽器對高度理解會產生錯誤，所以這種方法僅對firefox有效，對ie無效，既然這樣，我們就需要找出對ie的修正方法，於是有了另外一種方法。顧名思義，定位法是利用css定位屬性position對元素進行定位的方法，也屬於模擬方法，不過它對ie的支援還是不錯的。 它的html**為：垂直居中這段**比上一種方法中多出了乙個名為sub的div，它的作用是用來定位，原理就是：首先讓box出於相對定位，sub相對box出於相對定位，位於box垂直方向的50%，再讓content中的真正內容出於sub垂直方向的-50%，從而製作出content在box中垂直居中的效果，它們的css**如下：#wrap #subwrap #content這段**無論是在ie中還是firefox中，都能正常居中了。 當然，肯定還有許多垂直居中的方法，歡迎各位朋友交流補充。
如何讓div中的內容垂直居中
一 行高 line height 法 如果要垂直居中的只有一行或幾個文字，那它的製作最為簡單，只要讓文字的行高和容器的高度相同即可，比如 p 這段 可以達到讓文字在段落中垂直居中的效果。二 內邊距 padding 法 另一種方法和行高法很相似，它同樣適合一行或幾行文字垂直居中，原理就是利用paddi...
如何讓div中的內容垂直居中
雖然div布局已經基本上取代了 布局，但 布局和div布局仍然各有千秋，互有長處。比如 布局中的垂直居中就是div布局的一大弱項，不過好在千變萬化的css可以靈活運用，可以製作出準垂直居中效果，勉強過關。要讓div中的內容垂直居中，無非有以下幾種方法，等我一一枚舉 一 行高 line height ...
div中內容水平垂直居中
1.div高度自適應的情況 div在不設定高度的時候，會被裡面的內容撐開，內容自動填充在div中，無論是一行內容還是多行內容，此時不需要設定垂直居中，內容自動在中間的，想要看的更直觀些，只需要加上padding元素，內容四周便會留下空白，實現水平垂直居中的效果 css 如下 demohtml 如下 ...