flex弹性盒自动铺满写法

Flex弹性盒模型是CSS3的一种布局模式，其主要的特点是可以让内容自动适应不同的屏幕空间，更好的适应不同的设备。对于使用flex的自动铺满写法，需要实现以下步骤：

1、设置容器的display为flex。

2、定义容器的方向（row或column）及其他相关属性：justify-content（主轴对齐方式）、align-items（交叉轴对齐方式）等。

3、设置子元素的flex-grow属性为1，这样子元素就可以自动填充容器内的剩余空间。

举个例子，你想让三个div自动铺满父容器，可以按如下写法：

<div class="container">
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
</div>

.container {
  display: flex;
  justify-content: space-between;
}

.item {
  flex-grow: 1;
}

通过设置容器为flex布局，并使用justify-content: space-between属性，可以让子元素平均分配父容器的空间，从而达到自动铺满的效果。这样无论是在何种设备上，子元素都能自动进行适应，使页面更加适配多设备。