（1）
   .div1{ /!*水平居中*!/            margin:0 auto;            width:100px;            height:100px;            background: #1FC195;    }

（2）
  .div1{   /*水平居中*/
            position:relative;
            left:50%;
            width:200px;
            height:100px;
            margin-left:-100px;
            background:mediumseagreen;
   }

（3）  .div1{  /!*水平垂直居中*!/            position:absolute;            left:50%;            top:50%;            width:200px;            height:100px;            margin-left:-100px;            margin-top:-50px;            background:mediumseagreen;   }

（4）  .div1{  /!*水平垂直居中*!/            position:absolute;            top:0;            right:0;            bottom:0;            left:0;            margin:auto;            background: #D66464;            width:100px;            height:100px;   }


（5）
   .div1{  /!*水平垂直居中*!/
            position:absolute;
            left:50%;
            top:50%;
            transform:translateX(-50%);
            transform:translateY(-50%);
            background: #8FBC8F;
            width: 100px;
            height:100px;
    }