1.單行內容的居中
.middle-demo-1
2.父元素未設定高度，內容居中
.middle-demo-2
3.子元素有固定高度，
使用絕對定位的 div，把它的 top 設定為 50％，top margin 設定為負的 content 高度。
#content
4.使用**的 vertical-align property 屬性
5.子元素 position:absolute，有固定寬度和高度
#content
6.使用css3的translate
css參考：
各種居中方式大全
css居中是前端工程師經常要面對的問題，也是基本技能之一。今天有時間把css居中的方案彙編整理了一下，目前包括水平居中，垂直居中及水平垂直居中方案共15種。如有漏掉的，還會陸續的補充進來，算做是乙個備忘錄吧。內聯元素水平居中 利用text align center可以實現在塊級元素內部的內聯元素水平...
各種居中方案
元素居中是常見的場景，此頁為總結各種實現方式 內聯元素 inline,inline block等 將父元素的text align屬性設為center。text align css屬性定義行內內容 例如文字 如何相對它的塊父元素對齊。塊級元素 block等 設定margin left,margin r...
css居中方式
水平居中的text align center 和 margin 0 auto 前者是針對父元素進行設定而後者則是對子元素。他們起作用的首要條件是子元素必須沒有被float影響。垂直居中的line height 作用在父元素上，當他的值等於父元素的height值時，內部的文字就會自動的垂直居中 萬能p...