.

一、伸缩布局盒模型（伸缩格式化上下文（FFC）） 二兼容性 三display：flex和inline-flex   伸缩布局盒模型有两部分组成，分别为伸缩容器（父元素）和伸缩项目（子元素们）。将一个父元素的display声明为box或者flex的方式使得该父元素为子元素创建了一个伸缩格式化上下文（FFC）环境，然后这些子元素会通过一定的规则在这个伸缩盒子（父元素）中布局。FFC可有点类似于块级格式化上下文（BFC），他们区别在于

该属性应用在伸缩容器上，从而确定了伸缩容器的主轴的方向，以至于为伸缩项目的布局做好准备。改变的是主轴的方向对于伸缩容器的宽高不会改变，不如column不会意味着宽和高数值交换。 该属性中row等值与文本的书写方向有关，比如以row为例，如果书写方向为ltr，那么row就是意味着主轴方向为从右到左，如果为rlt则相反。 还要注意的是，该属性仅仅影响了伸缩容器主轴的方向，同时意味着主轴的开始和结束也就确定下来了，也意味着确定了伸缩项目的大致的布局方向。但是对于伸缩项目之间如何按照什么顺序布局，则有后续的属性决定

伸缩行 Flex items in a flex container are laid out and aligned within flex lines, hypothetical containers used for grouping and alignment by the layout algorithm. A flex container can be either sing

伸缩布局中的margin： 当使用flex属性计算伸缩项目的宽度的时候，为auto的margin会值为0 在主轴（main axis）方向 如剩余空间为正数，则剩余空间会被平均分配在拥有主轴方向auto margin(s)的flex元素之间。如剩余空间为负数，则将主轴方向的auto margin(s)设定为‘0’。 在侧轴（cross axis）方向 如果拥有侧轴