水平居中：
水平居中比較簡單，所以在這裡不做過多介紹，常用的方法是margin:auto 0 與 text-align:center
垂直居中
1.vertical-align:middle;是設定元素的垂直排列居中，但我們會經常遇到乙個問題就是用了這個屬性但似乎沒有效果，因為它只對一些特定顯示樣式的元素才會起作用。所以要實現上下垂直居中對齊，可以同時給元素設定display:table-cell;（按照單元格的樣式顯示元素）屬性。vertical-align:middle一般常用的屬性有：
top：將支援valign特性的物件的內容與物件頂端對齊。
text-top：將支援valign特性的物件的文字與物件頂端對齊。
middle：將支援valign特性的物件的內容與物件中部對齊。
bottom：將支援valign特性的物件的文字與物件底端對齊。
text-bottom：將支援valign特性的物件的文字與物件底端對齊
例如下列：
html元素：
我垂直居中啦！
我垂直居中啦！
我垂直居中啦！
css：
就能達到垂直居中效果，但這時margin將會失去效果，padding任然能起作用。由上可知一般支援vertical-align屬性的元素為單元格顯示方式：table-cell，效果類似於，以下例子也能達到以上效果：
我垂直居底部啦！
缺點是外層容器必須是是固定寬高的，否則無效。
2.第二種方法是將行距增加到和整個div一樣高： line-height:200px; 然後插入文字，就垂直居中了。但是缺點是要控制內容不能換行 。
3.那麼要實現不固定寬高居中就要寫js來動態控制，**如下：
$(function());
window.onresize = function());}})
css 水平居中 垂直居中 水平垂直居中
一 水平居中 1 行內元素水平居中text align center 2 塊級元素水平居中margin 0 auto 3 多個塊狀元素的水平居中 實現多個水平排列的塊狀元素的水平居中，是將要水平排列的塊狀元素設為display inline block，然後在父級元素上設定text align ce...
css水平居中 垂直居中 水平垂直居中
css水平居中 垂直居中 水平垂直居中 水平居中 行內元素 block text align 塊級元素 方案一 分寬度定不定兩種情況 定寬度 margin 0 auto 作用 使盒子自己居中，意思是上下距離為0，auto就是左右自適應兩邊距離 不定寬度 設定子元素display inline blo...
css 水平居中與垂直居中
1，行內元素先看它的父元素是不是塊級元素，如果是，則直接給父元素設定 text align center 如果不是，則先將其父元素設定為塊級元素，再給父元素設定 text align center 2，塊級元素 方案一 分寬度定不定兩種情況 定寬度 需要誰居中，給其設定 margin 0 auto ...