style标签flex

在HTML和CSS中，`flex`是一个非常重要的布局属性，它可以用来控制弹性容器中子元素的布局方式。`flex`属性可以添加到容器的CSS样式规则中，以指定容器的布局方式。

以下是使用`flex`属性进行布局的示例代码：

<div class="container">
  <div class="item">Item 1</div>
  <div class="item">Item 2</div>
  <div class="item">Item 3</div>
</div>

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

.item {
  flex-grow: 1;
  margin: 0 10px;
}

在上面的示例中，我们使用了`display: flex`将`container`元素设置为弹性容器。然后，我们使用`flex-direction: row`指定了子元素在主轴方向上的排列方式为水平方向，使用`justify-content: space-between`将子元素在主轴方向上均匀分布。

最后，我们使用`flex-grow: 1`将每个`item`元素的比例设置为1，使它们在主轴方向上均匀分布，同时使用`margin: 0 10px`来设置每个元素之间的间距。