盒子垂直水平居中

79 阅读1分钟

1.定位父级 position: relative;子级设置position: absolute
left: 50%;
top: 50%;
margin-left: -150px;
margin-top: -100px;
2.定位父级 position: relative;子级设置position: absolute
left: 0;
top: 0;
bottom: 0;
right: 0;
margin: auto;
3.定位父级position: relative;子级设置position: absolute;
left: 50%;
top: 50%; 
transform: translate(-50%,-50%);
4.用弹性布局直接给父级设置
display: flex;
justify-content: center;
align-items: center ;

若有收获,就点个赞吧