让一个容器水平居中的几种方法

1、position加margin。给父元素设置一个相对定位。给子元素添加一个绝对定位，然后设置margin:auto; top:0; right:0; bottom:0; left:0; （子元素为一个容器，主流浏览器支持，IE6不支持）
2、display:table-cell。给父元素设置 display: table-cell; vertical-align: middle; text-align: center;子元素设置：display: inline-block; vertical-align: middle; （兼容性：IE6、7不兼容）
3、定位加平移。给父元素设置一个相对定位，子元素设置绝对定位。然后给子元素设置X轴，Y轴平移50%：父元素： position: relative;子元素：position: absolute;
transform:translate(50%,50%);（ie9以下不支持transform·）
4、给父元素设置display:flex属性，利用弹性盒子，居中。父元素： display: flex; justify-content: center; align-items: center;（移动端使用较好，高宽自适应）
5、给父元素设置display:flex;属性，子元素设置:margin:auto;（移动端使用较好，高宽自适应）
6、父元素设置相对定位。子元素设置绝对定位。然后向右偏移父元素宽减去子元素宽的一半。向下偏移父元素高减去子元素高的一半。可以直接计算出数值进行偏移。
7、父元素设置相对定位。子元素设置绝对定位。然后设置left:50%;right:50%;在设置margin-left:(负的子元素宽的一半);margin-top（负的子元素高的一半）