DIV居中的几种方法

1.

 body{

 text-align:center;

 } 

缺点：body内所有内容一并居中

2.

.center{

position: fixed;

left: 50%;

}

缺点：需要设置position属性，网页复杂时容易扰乱页面布局,而且只是元素的起始位置居中

3.

 .center{

 width:500px;

 margin: 0 auto;

 }

缺点：需要设置div宽度

4.

 .center {

   display: -webkit-flex;

   -webkit-justify-content: center;

   -webkit-align-items: center;

  }  

缺点：需要支持Html5

5.

     .center {

         position: absolute;

         top: 50%;

         left: 50%;

         -ms-transform: translate(-50%,-50%);

         -moz-transform: translate(-50%,-50%);

         -o-transform: translate(-50%,-50%);

         transform: translate(-50%,-50%);

     }

缺点：需要支持Html5

6.

     margin: auto;

     position: absolute;

     left: 0;

     right: 0;

7.parent{

justify-content:center;

align-items:center;

display:_webkit-flex;

}