父元素样式
.father{
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
子元素垂直居中方法一
子元素要是块
absolute+top50%+maringTop(-div一半高度)
.son{
width: 400px;
height: 400px;
background: orange;
margin: 0 auto; /*水平居中*/
position: relative;
top: 50%; /*偏移*/
margin-top:-200px;
}
子元素垂直居中方法二
absolute+top50%+translateY(-50%)一半高度
子元素要是块
.son{
width: 400px;
height: 400px;
background: orange;
margin: 0 auto; /*水平居中*/
position: relative;
top: 50%; /*偏移*/
transform: translateY(-50%);
}