通過將父元素的display設定為flex,並將子元素的margin設定為auto即可實現，不過這種方法有些相容問題
如下：
.outer .inner這種方式不需要首先知道子元素的寬高，會根據內容自適應，還是很方便的。
設定父元素的position為relative,子元素的position為absolute,並設定其left,right,top,bottom都為0，margin為auto
.outer .inner但是這種方法必須首先知道子元素的高度，否則高度會充滿父容器，因為top和bottom都為0
個人覺得這種方法比較麻煩，但是之前好像還是一種比較常用的方式，最開始學前端時網上搜到的都是這種，也是利用了margin值可以設為負值這一性質吧
.outer .inner當然這種方法根據子元素的寬高設定margin值，所以首先也必須要知道子元素的寬高，剛看了張鑫旭大神的分享，發現這種方式在移動端css3動畫時好像還挺有用的~。
通過設定元素的display:table-cell是其展示出**中的單元格的顯示特性，同時利用vertical-align屬性設定內部元素的對齊方式。
.outer .inner 我是inner效果如下：我是inner中的乙個div
通過這種方式，inner是充滿outer的，其內部的元素垂直居中，而無論內聯元素還是塊級元素都有效，很適合內部內容高度未知的情況。
以上是我目前所了解的幾種方法，以後再慢慢總結完善~~~~
垂直居中的幾種方法總結
在css中最常用的就是居中對齊的樣式，flex布局方法使得垂直水平居中變得非常容易，但是flex具有瀏覽器相容問題，掌握其他css居中對齊的方法也是重要的。其中，水平居中較為簡單，通過判斷元素是行內元素還是塊級元素就能輕鬆區分 行內或類行內元素 text align center 塊級元素 marg...
css垂直居中的幾種方法
1.lineheight方法 html class container id div1 src test.png 一行文字span div css container div1 div1 img效果 說明 設定了lineheight和容器高度相同，vertical align middle 需要知道...
文字垂直居中的幾種方法
3 如果上面的 都不生效的話，有可能行內元素是在 裡面，這個時候可以利用inline元素的 css 屬性 vertical align 預設是 baseline 屬性，將其設定為 middle，這個屬性常用於 inline level 和 table cell 的元素。水平垂直居中 拓展 在垂直居中...