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

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

方法一：

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

    
    
    


    

        这个一个静态页面
    
    

        
div垂直水平居中
    

方法二：

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

    
    
    


    

        这个一个静态页面
    
    

        
div垂直水平居中
    

方法三：

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

    
    
    


    

        这个一个静态页面
    
    

        
div垂直水平居中