2024年03月22日 文字垂直居中 HTML垂直居中 css垂直居中的办法 前端div怎么设置垂直居中 懒猪技术
html结构如下：
<div class="parent">
<div class="child"></div>
</div>不知道自己高度和父容器高度的情况下, 利用绝对定位只需要以下三行：
.parent {
position:relative;
}
.child {
position: absolute;
top: 50%;
transform: translateY(-50%);
}若父元素设置了高度，则只需要使用相对定位即可
.parent {
height: xxx;
}
.child {
position: relative;
top: 50%;
transform: translateY(-50%);
}不考虑兼容老式浏览器的话，使用flex布局：
.parent {
display: flex;
display: -webkit-flex;
jusitify-content: center;
align-items: center;
}
本文链接：http://so.lmcjl.com/news/176/