對於乙個前端開發人員，元素居中在布局中相當常見，水平居中實現非常非常容易，如果是行內元素，設定text-align:center就行，如果是塊級元素，通過設定邊距margin:auto可實現水平居中。
垂直居中實現起來相對較為較為麻煩，不囉嗦，直接上乾貨。主要有下面幾種方法：
1、絕對定位方法
id="main">div>
#main
margin-top和magin-left是為了消除絕對定位50%帶來的偏差，值為塊級元素高和寬的一半的負值，不用過多解釋，應該都能理解。
借助calc()函式，可以將上面的**改造如下
#main
#main
這是比較推薦的一種方法，彈性布局的出現，的確是福音。
body
#main
css垂直居中的幾種方法
1.lineheight方法 html class container id div1 src test.png 一行文字span div css container div1 div1 img效果 說明 設定了lineheight和容器高度相同，vertical align middle 需要知道...
css 垂直居中的幾種方法
1.水平垂直居中 html css parent parent child parent child img 注 ie修復 display inline block 由於vertical align屬性與 一起使用，我們將父div設定為display table,並將子div設定為單元格displa...
CSS水平垂直居中的幾種方法
直接進入主題！css div imghtml 效果圖 當乙個元素絕對定位時，它會根據第乙個不是static定位的祖先元素定位，因此這裡的img根據外層div定位。css container inner html 效果圖 這裡，我們首先用top 50 和left 50 讓inner的座標原點 左上角 ...