子div 居中

1.（使用绝对布局）： 这种方式的弊端是：必须要知道这个容器的长宽，因为在子元素中的    margin-top:-100px;    margin-left:-100px; 这两个样式分别是子元素长、宽的一半。

2.万能方式：仍然是绝对布局，让left和top都是50%，这在水平方向上让div的最左与屏幕的最左相距50%，垂直方向上一样，所以再用transform向左（上）平移它自己宽度（高度）的50%，也就达到居中效果了，效果图和上方相同。//这种方式很好的避免了方式一的弊端，不需要知道自己的长宽，一样可以定位到中间

3.万能方法（使用弹性布局flex） //这种方式比较通用：这样给父元素设置了三个样式display:flex;(弹性布局)    justify-content:center;(内容水平居中)   align-items:center; (内容垂直居中) 就可以达到水平、垂直居中的效果

4.方法四（使用绝对布局） //使用这种方式的要领是：子绝父相，且子元素要设置以下的样式position:absolute; top:0; right:0; bottom:0; left:0; margin:auto; 就可以达到居中效果