利用css3实现垂直居中有很多方法，下面我简单的介绍几种css3实现垂直居中的方法，供大家参考；

flex布局

利用css3的新属性flex可以轻松实现垂直居中，具体方法，看下图代码：

绝对定位（position）+transform

利用绝对定位（position）+transform也可以实现垂直居中，具体实现，看下图代码：

效果图：

总结：

以上两种方法，都可以实现垂直居中，但是css3新属性存在兼容性问题，如果不考虑兼容性的话，完全可以直接使用；如果考虑兼容性，可以使用其他css方式。

如有疑问，欢迎在评论下方留言讨论；喜欢的记得点赞+关注，为大家提供专业的前端知识