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;
} 
本站部分文章搜集整理于互联网或者网友提供,如有侵权请联系站长
如若转载,请注明出处:https://www.htmlbk.com/web/998.html
温馨提示:该文档最后一次修改时间为2022-07-21 16:28:53,请注意相关的内容是否还可用!