div在不同分辨率屏幕上下左右居中
2018-12-05 本文已影响0人
李彩红_4da9
方法一：
div{
position:absolute;
width: 200px;
height:200px;
background:red;
top:50%;
left:50%;
margin-left:-100px;
margin-top:-100px;
}
方法二：
div{
position:absolute;
width: 200px;
height:200px;
background:red;
top: 0;
left: 0;
bottom: 0;
right: 0;
margin:auto;
}
方法三：
div {
position:absolute;
width: 200px;
height:200px;
background:red;
top:50%;
left:50%;
transform:translate(-50%,-50%);
}
方法四：
div{
position:absolute;
width: 200px;
height:200px;
background:red;
top: calc((100% - 200px)/2);
left:calc((100% - 200px)/2);
}
