元素高度确定的情况下，我喜欢使用下面这种方案，因为兼容性良好，无须增加额外元素。
//父元素，高度不定
.wrap{
border:1px solid black;
height:500px;
position:relative;
}
//需要居中的子元素，有确定的高度
.content{
height:100px;
width:100px;
background-color:pink;
position:absolute;
top:50%;
margin-top:-50px;//高度的二分之一
}
jsbin在线查看效果：https://gist.github.com/anonymous/f72f9190b90877154b472fae6369911b
CSS设置行内元素的水平居中 CSS设置行内元素的垂直居中 CSS设置块级元素的水平居中 CSS设置块级元素的垂直居中
行内元素居中 html css before元素居中 html css table-cell居中 css 垂直居中...
css 水平垂直居中实现方式 水平垂直居中包括行内元素居中，以及块级元素居中 行内元素html结构 块级元素结构 ...
1.块级元素水平居中，水平元素垂直居中 CodePen:CSS块级水平居中 2.块级元素垂直居中 CodePen:...
前言 总括：整理 css 垂直水平居中方法，区分内联元素与块级元素 CSS垂直居中和水平居中 用css让一个容器水...
css居中大全 Horizontally 水平居中 内联元素 块级元素 多个块级元素 Vertically 垂直...
css图片居中(水平居中和垂直居中) css图片水平居中 块状元素直接用text-align:center, di...
CSS居中总结 最近在学习CSS居中,居中里面又包含水平居中和垂直居中,分不太清内联元素(inline or in...
css图片水平居中 css图片垂直居中 css图片水平垂直居中
标签（空格分隔）： css 垂直居中浮动元素 垂直居中元素，在布局中经常使用，总结一下： 方法一：已知元素的高宽 ...
本文标题：CSS元素垂直居中
本文链接：https://www.haomeiwen.com/subject/stdbbttx.html
网友评论