盒模型水平垂直居中方法

1.已知宽高

　　position：absolute；

　　top：50%

　　left：50%；

　　（↓↓↓↓↓↓↓↓↓↓↓↓取自身宽高一半）

　　margin-left：50%；

　　margin-top：50%；

2.子模型宽高不定

　　position：relactive / absolute

　　top:50%;

　　left:50%;

　　transfrom:translate(-50%,-50%) → 偏移自身宽高的-50%；

3.table-cell

　　父：dispaly：table-cell；

　　       vertical-align：middle；

　　子：margin：0 auto；

4.弹性布局

　　display：flex；

　　align-items：center；

　　justify-content：center；

 

转载于:https://www.cnblogs.com/aruanmei/p/8540198.html