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;

}