css实现元素水平垂直居中常见的两种方式实例详解

这篇文章主要给大家介绍了css实现元素水平垂直居中的两种方式,文中给出了完整的示例代码供大家参考学习,对大家的学习或者工作具有一定的参考价值,有需要的朋友们下面来一起看看吧。

一、父元素的flex布局实现元素的水平垂直居中

示例代码如下:

   Document 

效果图如下:

二、绝对定位&负margin值实现元素水平垂直居中

注意:元素本身需要确定宽度和高度

示例代码如下:

   Document 

效果图如下:

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对html中文网的支持。

以上就是css实现元素水平垂直居中常见的两种方式实例详解的详细内容,更多请关注0133技术站其它相关文章!

赞(0) 打赏
未经允许不得转载:0133技术站首页 » CSS 教程