本文给大家分享了4中图片垂直居中显示的效果，非常不错，具有参考借鉴价值，感兴趣的朋友一起看看吧

第1种，居中效果 居中效果 /*第1种，垂直居中效果*/ .box{ width: 200px;height: 200px;border: 1px solid #ccc; position: relative; } .center{ width: 100px;height: 100px;background: gray; margin: auto;position: absolute;top: 0;left: 0;bottom: 0;right: 0;