开始喽!
懵逼版垂直居中(绝对定位)
parentElement{
position:relative;/*高度未知*/
}
childElement{
position: absolute;
top: 50%;
transform: translateY(-50%);
/*若此节点旁边有东西*/
left: xxxx;
}
不懂transform的戳我
独生子版垂直居中(相对定位)
parentElement{
height:xxx;/*高度已知*/
}
childElement {
position: relative;
top: 50%;
transform: translateY(-50%);
/*若此节点旁边有东西*/
left: xxxx;
}
Flex版垂直居中
parentElement{
display:flex;/*Flex布局*/
display: -webkit-flex; /* Safari */
align-items:center;/*指定垂直居中*/
}