css 垂直居中、水平居中
- 在父元素、子元素未知的情况下居中有两种方法：
第一种方法：
.partent{
display:flex;
justify-content:center;
align-items:center;
}
第二种方法：
.partent{
display:flex;
}
.partent .child{
margin: auto;
}
- 父元素高度已知，子元素高度未知的情况下：
.partent{
height: 300px;
}
.partent .child{
line-height: 300px;
text-algin: center; //水平居中在子元素为块级元素时生效
}
- 父元素高度未知，子元素高度、宽度已知的情况下：
.partent{
position: relative;
}
.partent .child{
width: 100px;
height: 100px;
position: absolute;
top: 50%;
margin-top: -50px;
left: 50%;
margin-left: -50px;
}
注： margin的百分比是基于父元素的宽度的百分比的外边距。
