请解释一下 CSS3 的 Flexbox（弹性盒布局模型）, 以及适用场景？

CSS3的Flexbox（弹性盒布局模型）提供了一种更加灵活的方式来对容器内的项进行布局，无论它们是行内元素还是块级元素。Flexbox可以用来创建复杂的布局，而不需要使用多个嵌套的div元素。

Flexbox布局的主要特点包括：

1. 能够对项进行垂直或水平排列。
2. 能够对项进行弹性伸缩以填满可用空间或根据容器大小自动调整项的大小。
3. 能够轻易的改变项的排列方向。
4. 能够轻易的控制项的对齐方式。
5. 能够提供一个新的方向（主轴和交叉轴）来定义项的排列。

Flexbox适用于以下场景：

1. 需要创建具有复杂布局的应用程序，例如多列布局、响应式设计、弹出窗口、自适应用户界面等。
2. 需要创建具有复杂项排列和对齐的布局，例如图片画廊、商品排列、导航菜单等。
3. 需要创建可以伸缩的用户界面元素，例如图表、图形和数据可视化等。
4. 需要创建可以适应不同屏幕尺寸和设备的布局，例如响应式网页设计、移动应用界面等。

下面是一个简单的Flexbox布局示例：

.container {
  display: flex; /* 使用弹性盒布局 */
  flex-direction: row; /* 设置主轴方向为水平 */
  justify-content: space-around; /* 设置项在主轴方向上的对齐方式 */
}
 
.item {
  flex: 1; /* 设置项的伸缩性为1，意味着它们会等分容器的空间 */
  min-width: 100px; /* 设置项的最小宽度 */
}

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

在这个例子中，.container 是一个弹性盒，其中包含三个 .item 项。通过Flexbox，这三个项将会被等分地排列在容器中，并且各自至少有100px的宽度。