margin: auto 实现水平垂直居中

@hansy 2019-04-09 03:07:23
一般来说 margin:auto 只能实现水平居中,但是结合flexbox布局,就能实现水平和垂直方向都居中。

效果图如下:



css:
.automargin {
display: flex;
width: 100%;
height: 100%;
}
.automargin div {
margin: auto;
}

html:
<div class="automargin">
<div>利用父级display: flex;和子级margin: auto;实现元素水平垂直居中</div>
</div>
...全文
689 5 打赏 收藏 举报
写回复
5 条回复
切换为时间正序
当前发帖距今超过3年,不再开放新的回复
发表回复
kerwin_1727 2021-04-21
。。。。。。。。画蛇添足?
  • 打赏
  • 举报
回复
JA+ 2021-04-19
但是。。。为什么呢。
  • 打赏
  • 举报
回复
ZanMusi_1998 2019-04-18
就是留言 赚经验
  • 打赏
  • 举报
回复
tomorrownan 2019-04-09
。。。。是的吧
  • 打赏
  • 举报
回复
这个帖子是要做什么送分帖还是给自己做精的
  • 打赏
  • 举报
回复
相关推荐
发帖
CSS

6.0w+

社区成员

层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
社区管理员
  • HTML(CSS)社区
加入社区
帖子事件
创建了帖子
2019-04-09 03:07
社区公告
暂无公告