如何让一个div在页面正中
如何让一个div在页面正中
我今天说的是让一个div水平居中同时垂直居中,而不是简单的top:50%,left:50%。当然,我们就按一开始的思路写一下:top,left属性都设为50%,现在我们只需tanslate(-50%,-50%)就可以达到div既水平居中同时垂直居中。
{
position: absolute;
left: 50%;
top: 50%;
background: #CCCCCC;
width: 400px;
height: 200px;
transform: translate(-50%,-50%);
}
translate() 方法
通过 translate() 方法,元素从其当前位置移动,根据给定的 left(x 坐标) 和 top(y 坐标) 位置参数