基本概念

Flex布局中主要包含了以下五个概念：

1. 弹性容器（flex container）：采用Flex布局的外层容器。

2. 弹性项（flex item）：容器中的子元素。

3. 主轴（main axis）： 弹性容器的水平或垂直方向。

4. 交叉轴（cross axis）：与主轴垂直的方向。

5. 对齐方式（align）：设置弹性项在弹性容器内的对齐方式。

采用 Flex 布局的元素，称为 Flex 容器（flex container），简称”容器”。它的所有子元素自动成为容器成员，称为 Flex 项目（flex item），简称”项目”。

容器默认存在两根轴：水平的主轴（main axis）和垂直的交叉轴（cross axis）。主轴的开始位置（与边框的交叉点）叫做main start，结束位置叫做main end；交叉轴的开始位置叫做cross start，结束位置叫做cross end。
项目默认沿主轴排列。单个项目占据的主轴空间叫做main size，占据的交叉轴空间叫做cross size。
以上这些基础概念，请务必牢记，下面说属性时，不再重复说明！