DIV实现水平和垂直居中

定位居中

给父元素设置宽高并且设置相对定位属性position：relative，并且给要居中的元素也设置绝对定位属性position：absolute，确保该元素是根据以定位父元素来定位的，在子元素已知宽高的情况下使用margin 0 auto属性使元素水平居中，之后给以定位的子元素设置top：50%，然后margin-top的值为负的子元素高的一半，就完成了垂直居中。

如果子元素是未知宽高可以使用css3的transfrom：translateY或者translateX属性来进行偏移。

flex弹性布局实现居中

将父元素设置为display：flex弹性盒子，然后通过justify-content：center水平居中，然后在设置align-items: center;实现垂直居中。