給父元素添加一個相對定位傅蹂，然后給子元素添加這個css樣式
position: relative;
.center{
position: absolute;
top:50%;
left:50%;
width:100%;
transform:translate(-50%,-50%);
text-align: center;
}
有個缺點就是用定位后司志，如果你的頭部也是用定位抢韭，那么用了這個定位后例衍。你查看內容的時候昔期，內容滾到頭部會顯示在頭部上面。
第二種方法：給父元素的類添加這個就可以實現垂直居中和水平居中了
display: flex;
align-items: center; //垂直居中
justify-content: center; //水平居中
