这篇文章主要介绍“css实现div水平和垂直居中”，在日常操作中，相信很多人在css实现div水平和垂直居中问题上存在疑惑，小编查阅了各式资料，整理出简单好用的操作方法，希望对大家解答”css实现div水平和垂直居中”的疑惑有所帮助！接下来，请跟着小编一起来学习吧！

盐山网站制作公司哪家好，找创新互联公司！从网页设计、网站建设、微信开发、APP开发、响应式网站开发等网站项目制作，到程序开发，运营维护。创新互联公司从2013年成立到现在10年的时间，我们拥有了丰富的建站经验和运维经验，来保证我们的工作的顺利进行。专注于网站建设就选创新互联公司。

示例1 chrome33、ie8测试通过：

代码如下:

示例2 chrome33、ie8测试通过：

代码如下:

示例3 chrome33、ie8测试通过：

代码如下:

示例4 chrome33测试通过，ie8测试不通过，参考http://www.w3school.com.cn/tiy/t.asp?f=css3_box-pack：

代码如下:

注：对页面中所有元素应用box-sizing:border-box样式是为了将padding、margin值都计入width、height中，即为元素指定的任何内边距和边框都将在已设定的宽度和高度内进行绘制(http://www.w3school.com.cn/cssref/pr_box-sizing.asp)。在上述代码中应用该样式无意义，但是在企业级应用中应用该样式可以减少很多界面缺陷，如标签未对齐。

到此，关于“css实现div水平和垂直居中”的学习就结束了，希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习，快去试试吧！若想继续学习更多相关知识，请继续关注创新互联网站，小编会继续努力为大家带来更多实用的文章！

本文题目：css实现div水平和垂直居中
本文URL：http://chengdu.cdxwcx.cn/article/pepcho.html