div盒子水平垂直居中方法总结

CSS学习知识点自检

之前面试的时候遇到过这题，当时脑袋空空，只想到了绝对定位 + translate位移这一种常用的方法，于是在这里进行方法总结。
让盒子水平垂直居中通常是相对于嵌套盒子而言的，是子盒子相对于父盒子的居中。

/* 嵌套盒子 */
    <div class="father">
        <div class="son"></div>
    </div>

---

方法一：子绝父相 + 负margin

.father {
   
            position: relative;
            height: 200px;
            width: 200px;
            background-color: powderblue;
        }
        
 .son {