使一个div水平垂直居中的方法

在工作中,经常会碰到让一个div垂直水平居中。

方法一:

使用绝对定位:不确定div的宽度和高度时,采用 transform: translate(-50%, -50%);当前div的父级添加position:(relative/absolute/fixed)




    
    Document
    


    
这个一个静态页面

方法二:

使用flex布局:当前div父级
display: flex;
justify-content: center;
align-items: center;




    
    Document
    


    
这个一个静态页面

方法三:

使用绝对定位方法:
当前div
top right bottom left 都设置为0
margin: auto;
设置宽高




    
    Document
    


    
这个一个静态页面

你可能感兴趣的:(使一个div水平垂直居中的方法)