基本概念采用Flex布局的元素称为弹性容器，简称“容器”。它的所有子元素自动成为容器的成员，称为弹性项目（flexitem），简称“项目”。容器默认有两个轴：水平主轴和垂直横轴。主轴的起始位置（与边框的交点）称为mainstart，结束位置称为mainend；交叉轴的起始位置称为crossstart，结束位置称为crossend。默认情况下，项目沿主轴排列。单个item占用的主轴空间称为mainsize，单个item占用的横轴空间称为crosssize。容器的属性在容器上设置以下6个属性。flex-directionflex-wrapflex-flowjustify-contentalign-itemsalign-contentflex-directionflex-direction属性确定主轴的方向（即项目排列的方向）。.box{弹性方向：行|行反转|栏目|列反转；}row（默认）：主轴是水平的，原点在左端。row-reverse：主轴水平，起点在右端。column：主轴垂直，起点为上边缘。column-reverse：主轴垂直，起点在底部。flex-wrap属性默认情况下，项目排列在一条线上（也称为“轴”）。flex-wrap属性定义了轴线不适合时如何换行。它可能取三个值（1）nowrap（默认）：不换行（2）wrap：换行，上面第一行（3）wrap-reverse：换行，下面第一行。flex-flowflex-flow属性是flex-direction属性和flex-wrap属性的简写形式，默认值为rownowrap。.box{flex-flow:;}justify-contentjustify-content属性定义项目如何在主轴上对齐。.box{justify-content:flex-start|弹性端|中心|间隔|space-around;}flex-start(default):leftjustifyflex-end:rightjustifycenter:centerspace-between:两个对齐，项目之间的间距相等。space-around：每个项目两边的间距相等。因此，项目之间的间距是项目与边框之间的间距的两倍。align-itemsalign-items属性定义项目如何在交叉轴上对齐。.box{对齐项目：flex-start|弹性端|中心|基线|stretch;}flex-start：对齐横轴的起点。flex-end：横轴末端对齐。center：横轴的中点对齐。baseline：项目中第一行文本的基线对齐方式。stretch（默认）：如果item没有设置高度或者设置为auto，它会占据整个容器的高度。align-contentalign-content属性定义了多个轴的对齐方式。如果项目只有一个轴，则此属性无效。.box{对齐内容：flex-start|弹性端|中心|间隔|环绕空间|stretch;}flex-start：与横轴起点对齐。flex-end：与交叉轴的末端对齐。center：与横轴的中点对齐。space-between：与横轴两端对齐，轴与轴之间的间隔均匀分布。space-around：每个轴两边的间距相等。因此，轴之间的距离是轴与框架之间的距离的两倍。stretch（默认）：轴填充整个交叉轴。项目的属性在项目上设置了以下6个属性。orderflex-growflex-shrinkflex-basisflexalign-selforderorder属性定义项目的排序顺序。值越小排名越高，默认为0。.item{order:;}flex-growflex-grow属性定义了item的放大比例，默认为0，即，如果还有剩余空间，则不会放大。.item{flex-grow:;/*default0*/}flex-shrinkflex-shrink属性定义了item的收缩率，默认为1，即如果空间不足，item会收缩。.item{flex-shrink:;/*default1*/}如果所有item的flex-shrink属性都为1，当空间不足时，会按比例缩小。如果一个item的flex-shrink属性为0，其他item为1，前者在空间不足时不会收缩。负值对该属性没有影响。flex-basisflex-basis属性定义在分配多余空间之前项目在主轴（主要尺寸）上占据多少空间。浏览器根据这个属性计算主轴是否有多余空间。它的默认值为auto，即项目的原始大小。.item{弹性基础：<长度>|汽车;/*defaultauto*/}可以设置为与width或height属性相同的值（比如350px），那么item会占据一个固定的空间。flexflex属性是flex-grow、flex-shrink和flex-basis的简写，默认值为01auto。最后两个属性是可选的。.item{flex:无|[<'flex-grow'><'flex-shrink'>?||<'flex-basis'>]}align-selfalign-self属性允许单个item有不同的Alignment，可以覆盖align-items属性。默认值为auto，表示继承父元素的align-items属性。如果没有父元素，相当于stretch。.item{对齐自我：自动|弹性启动|弹性端|中心|基线|拉紧;}
