Vue中样式实现居中

最新推荐文章于 2025-05-01 22:08:47 发布

梁栋沉

最新推荐文章于 2025-05-01 22:08:47 发布

阅读量8.4k

点赞数 5

CC 4.0 BY-SA版权

文章标签： vue.js javascript 前端

原文链接：https://www.cnblogs.com/doseoer/p/4581284.html

这篇博客揭示了一个鲜为人知的CSS技巧，通过设置`margin:auto`和`position:absolute`，可以实现元素的垂直居中。示例代码`.Absolute-Center`展示了如何将元素在容器中垂直和水平居中。这种方法打破了对`margin:auto`仅用于水平居中的传统认知，为网页布局提供了新的解决方案。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

我们经常用margin:0 auto来实现水平居中，而一直认为margin:auto不能实现垂直居中……实际上，实现垂直居中仅需要声明元素高度和下面的CSS:

.Absolute-Center {
margin: auto;
position: absolute;
top: 0; left: 0; bottom: 0; right: 0;
}
最近使用了这个效果，转载于：
https://www.cnblogs.com/doseoer/p/4581284.html

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。