伸缩盒(flex布局)

一、属性

• flex 复合属性。设置或检索弹性盒模型对象的子元素如何分配空间。
• flex-grow 扩展比率
• flex-shrink 收缩比率
• flex-basis 伸缩基准值
• flex-flow 排列方式
• flex-direction 排列方向
• flex-wrap 该属性控制flex容器是单行或者多行，同时横轴的方向决定了新行堆叠的方向
• align-content 对齐方式
• align-items 定义flex子项在flex容器的当前行的侧轴（纵轴）方向上的对齐方式
• align-self 定义flex子项单独在侧轴（纵轴）方向上的对齐方式。
• justify-content 设置或检索弹性盒子元素在主轴（横轴）方向上的对齐方式。
• order 设置或检索弹性盒模型对象的子元素出現的順序。

二、例子

另，其他：http://www.runoob.com/w3cnote/flex-grammar.html