盤點8種CSS實現垂直居中水平居中的絕對定位居中技術

1.絕對定位居中（Absolute Centering）技術

　　我們經常用margin:0 auto;來實現水平居中，而一直認為margin:auto;不能實現垂直居中......實際上，實現垂直居中僅需要聲明元素高度和下面的CSS:

.Absolute-Center {
   margin : auto ;
   position : absolute ;        
   left :  0 ; right : 0 ;  top :  0; bottom: 0;
}

　優點：

　　1.支持跨瀏覽器，包括IE8-IE10；

　　2.無需其他特殊標記，CSS代碼量少；

　　3.支持百分比%屬性值和min-/max屬性；

　　4.只用這一個類可實現任何內容塊居中；

　　5.不論是否設置padding都可居中（在不使用box-sizing屬性的前提下）；

　　6.內容塊可以被重繪；

　　7.完美支持圖片居中。

  缺點：

　　1.必須聲明高度（查看可變高度 Variable Height）;

　　2.簡易設置overflow:auto;來防止內容月結溢出。（查看溢出Overflow）

　　3.在Windows Phone設備上不起作用

   瀏覽器兼容性：

　　Chrome,Firefox,Safari,Mobile Safari,IE8-IE10，

　　絕對定位方法在最新版Chrome,Firefox,Safari,Mobile Safari,IE8-IE10上均測試通過。