1）單行文本的居中
主要實現css代碼：
水平居中：text-align:center;
垂直居中：line-height:XXpx; /*line-height與元素的height的值一致*/
s
2) 多行文本的垂直居中我們有很多種實現方式
1)使用display:table來實現
主要實現代碼：
display: table使塊狀元素成爲一個塊級表格;
display: table-cell;子元素設置成表格單元格;
vertical-align: middle;使表格內容居中顯示，即可實現垂直居中的效果;
2) 使用absolute與transform配合實現
主要實現代碼：
position:absolute; 首先給文本絕對定位；
left:50%;top:50%;transform:translate(-50%,-50%); 讓文本距離盒子左邊和上邊分別爲50%，再用transform向左（上）平移它自己寬度（高度）的50%，也就達到居中效果了.
3）使用flex實現
主要實現代碼：
display: flex;設置 display 屬性的值爲 flex 將其定義爲彈性容器
align-items: center;定義項目在交叉軸（縱軸）上如何對齊，垂直對齊居中
justify-content: center; 定義了項目在主軸上的對齊方式，水平對齊居中
4）使用 position 定位
- 將父元素設置爲 positon:fixed，然後上下左右都爲 0；使其填滿整個屏幕；
- 子元素也設置爲 positon:fixed，然後上下左右都爲 0；margin 設置爲 auto，實現水平垂直居中。
5）grid 佈局
歡迎大家多多補充哦