元素水平垂直居中两种方法
transform
#father {
position: relative; // 子绝父相,父占位,子绝对
}
#son {
position: absolute;
top: 50%;
left: 50%;
transform: translate(50%, 50%);
}
flex
#father {
display: flex;
justify-content: center;
align-items: center;
}
文字水平垂直居中
#father {
height: 100px;
line-height: 100px; // line-height等于height
text-align: center;
}