display:flex

"flex" 是 CSS3 中的一个布局属性，它可以用来创建灵活的和自适应的布局。当我们将 "display" 属性设置为 "flex" 时，该元素将成为一个 Flex 容器，它的子元素将变成 Flex 项目，可以通过 Flex 相关的属性来控制它们的排列方式和对齐方式。以下是一个简单的例子：

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

.container {
  display: flex;
}

.item {
  flex: 1;
}

以上代码将创建一个 Flex 容器，其中包含三个 Flex 项目。每个项目都会平均地占用容器的可用空间，从而实现了自适应布局。