css 弹性盒子布局flex

flex布局是一种新的布局方式，它可以非常优雅地实现子元素的居中或均匀分布，甚至可以随着窗口缩放自动适应。相比于传统的布局方式，flex布局更加灵活，可以更好地适应不同的屏幕尺寸和设备。在小程序中，flex布局是完全兼容的，并且微信官方也推荐使用flex布局。如果你想了解更多关于flex布局的知识，可以参考上面提供的链接。下面是一个简单的例子：

.container {
  display: flex;
  justify-content: center;
  align-items: center;
}

.item {
  width: 100px;
  height: 100px;
  background-color: red;
}

这个例子中，我们创建了一个容器，使用`display: flex`将其设置为flex布局。然后，我们使用`justify-content: center`和`align-items: center`将子元素居中对齐。最后，我们创建了一个子元素，设置其宽高和背景颜色。这样，我们就可以实现一个简单的居中布局。