1、先看下初始化代码，此时div没有水平和垂直居中<html><head><meta charset="稆糨孝汶;utf-8"><style></style></head><body><div style="border:1px red solid;width:500px;height:500px;"></div> </body></html>
2、运行结果如下
3、我们来实现让div水平居中让div实现水平居中的最佳方式是设置margin为auto(自动)，或者仅仅设置margin-left与margin-right自动。代码如下： margin:auto;
4、运行结果如下
5、然后我们来设置让div垂直居中。垂直居中也可以通过设置margin方式实现。不过不能设置为auto，要设置上下margin的具体的百分比或者具体的像素值。不过这个只能根据你的实醪撅此饕际情况来设置，我这里只需要设置margin-top为5%就可以了代码如下margin-top:5%;
6、运行结果如下
7、还有几种垂直居中方法1. 垂直居中也可以通过设置div的父元素的padding方式实现我这里设置的padding-top:5%;代码如下：
8、运行结果如下
