Flex布局

基本概念

由Flex布局构成的元素被称作Flex容器（flex container），简称'容器'。所有子元素自然地成为项目的组成部分，并被称作 Flex 项目（flex item），简称'项目'。

该容器在默认配置中包含两个主要轴线：一个是水平方向的main axis（horizontal main axis），另一个是垂直方向的cross-axis（vertical cross-axis），并且默认情况下项目按照这些主要轴线进行分布。

• main start/main end: 主轴起始点/终止点；
  • cross start/cross end: 交叉轴起始点/终止点；
  • main size/cross size: 单一项目占用主轴/交叉轴的空间

容器属性

设置在容器上的属性有6种。

• directionality
  • wrap
  • flow
  • content alignment
  • item alignment
  • content alignment

flex-direction属性

决定