我想把一个div定位在屏幕的中心。问题是当div很小的时候,从左边45%看起来还不错,但是当div更长(即宽度更大)时,我需要将其从左边改为30%。
有没有一种智能的方法可以根据div的大小来定位div在中心位置。
body {
background:blue;
}
.box {
position: absolute;
top:10px;
left:30%;
background:white;
padding:10px;
border-radius:10px;
}
<div class="box"> 这是一个很长的div,所以需要left = 30% </div>
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
你可以通过以下方式将其水平居中:
.box { position: absolute; top:10px; left:50%; background:white; padding:10px; border-radius:10px; transform: translateX(-50%); }您可以使用
display: flex;属性将组件居中对齐。css flex
body { flex: 1; background:blue; display: flex; justify-content: center; } .box { position: absolute; top:10px; background:white; padding:10px; border-radius:10px; }