css 两个div居中显示

当需要让两个元素水平和垂直居中时，我们可以使用以下的CSS代码：

.container{
      display: flex;
      justify-content: center;
      align-items: center;
}
.box{
      width: 200px;
      height: 200px;
      background-color: #f0f0f0;
}
    

在上面的代码中，我们首先在包含着两个元素的父元素上设置了"display:flex"，这样子元素就可以使用flexbox来进行布局。

然后，我们分别使用"justify-content:center"和"align-items:center"来让子元素水平和垂直居中。如果我们只想让元素水平或垂直居中，在对应的属性上设置值"center"即可。

最后，我们在子元素上设置了一个固定的宽高和背景颜色，以便更好地观察布局效果。

总之，在CSS中，我们可以使用flexbox来实现元素的水平和垂直居中。当然，其他的方法如使用position和transform等也可以实现相同的效果，但是flexbox更加简单和灵活。

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