Open LoveShoneLiu opened 6 years ago
div上下左右居中是一个非常老也是非常经典的问题，我也遇到过此类问题多次，所以总结一下，希望对大家有帮助，谢谢！
注：position: absolute; left:0; top:0; right:0; bottom:0;是为了让子div感知到父div的宽高，这样margin: auto就能生效了。 第二种方法：
第一种方法：
注：这种方法是最简单的，但是使用了css3的内容，所以兼容性要求ie9及以上。低版本浏览器不兼容。 第二种方法：
注：这种方法是利用table的属性实现。 第三种方法：
注：这种方法用到了flex，所以不兼容ie9以下浏览器，父display: flex;之后子div的margin: auto; 就能感知到父的高度，所有就会生效。从而实现绝对居中。 第三种方法：
div上下左右居中是一个非常老也是非常经典的问题，我也遇到过此类问题多次，所以总结一下，希望对大家有帮助，谢谢！
注：position: absolute; left:0; top:0; right:0; bottom:0;是为了让子div感知到父div的宽高，这样margin: auto就能生效了。 第二种方法：
第一种方法：
注：这种方法是最简单的，但是使用了css3的内容，所以兼容性要求ie9及以上。低版本浏览器不兼容。 第二种方法：
注：这种方法是利用table的属性实现。 第三种方法：
注：这种方法用到了flex，所以不兼容ie9以下浏览器，父display: flex;之后子div的margin: auto; 就能感知到父的高度，所有就会生效。从而实现绝对居中。 第三种方法：