CSS盒模型和图片水平居中和垂直居中

盒子水平居中，使用margin:0 auto

盒子垂直居中，使用相对定位，以body为基准absolute，然后top:50%，但是盒子有高度所以还得margin-top:-100px，让盒子上移自己宽度的一半。

综上，如果要让div垂直居中，水平居中，就使用相对定位，以body为基准absolute，top left 50%并且减掉自身的一半，代码如下

当使用插入图片的方式时，img是行内元素所以只需要使用text-align:center和行高等于高，就能使图片水平居中垂直居中。

当使用背景图片水平居中，使用top center，代码如下：

当使用背景图垂直居中，代码如下，50%是参考值

背景图水平+垂直居中，如果需要图片全部铺满，则加上background-size: contain;