方法一:flex 布局下的 margin: auto
<div class = "g-container">
<div class = "g-Box"></div>
</div>
.g-container {
display:flex;
}
.g-Box {
margin:auto;
}
上面的 display: flex 替换成 display: inline-flex | grid | inline-grid 也是可以的。
在 display: flex 布局下, margin auto 的生效不仅是水平方向,垂直方向也会自动去分配这个剩余空间。
方法二:grid 布局下的 place-items: center
直接上代码:
.g-container {
display: grid;
place-items: center
}
原文地址:https://blog.csdn.net/weixin_41126975/article/details/114175923
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。