css两个div垂直居中显示（css中两个div并排垂直对齐）

CSS是一种让html元素更美观、布局更加合理的标记语言。在进行开发时，我们经常需要制作元素在页面中的布局。其中，让两个div垂直居中的布局，也是我们经常遇到的问题。

以下是实现两个div垂直居中的常用方法：

.parent {
    display: flex;
    align-items: center;
    justify-content: center;
}
.child {
    margin: auto;
}
    

上述代码中，我们首先使用flex布局，将父元素中的两个div进行垂直居中。具体来说，我们使用align-items:center来让子元素垂直居中；使用justify-content:center来让子元素水平居中。

接着，我们使用子元素的margin:auto来让两个div保持等距、居中对齐。因为margin:auto会自动把剩余的空间分配到左右两侧，从而实现了居中对齐的效果。

这种方法的优点是实现简单、效果良好。如果你对IE浏览器的兼容性要求不高，那么这种方法绝对是一个不错的选择。

除了上述的方法，还有一些其他的实现垂直居中的方法，比如使用绝对定位、使用table-cell布局等等。不同的方法适用于不同的场合，我们可以根据实际需求灵活运用。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！