div水平垂直居中

1、使用margin负值

HTML：<div></div>

css:

div{
width: 100px;
height: 100px;
background-color: red;
position: absolute;
left: 50%;
margin-left: -50px;
top:50%;
margin-top:-50px;
}

2、使用transform

position: absolute;
left: 50%;top:50%;

transform: translate(-50%,-50%);