2020-09-07

               子元素如何居中的几种方法

1. 已知盒子大小：

1) 子盒子：定位+margin（position: absolute; left:50%; top:50%; margin-top:-盒子高度一半px;margin-left:-盒子宽度一半px）

水平居中margin: 0 auto;也可以

2) 子盒子：定位：positon: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto;

2. 未知盒子大小：定位+transform （left:50%;top:50%;transform: translate(-50%,-50%)）

3. flex布局: 父盒子 display:flex; just-content: center; aligin-items: center; (css英文可能有误)

4. 父盒子：display: table-ceil; text-align: center; vertical-align: middle;

5. 使用js获取到盒子的宽高，按照方法1设置 定位+margin