移动端flex布局知识点归纳总结

1. 布局原理：通过给父盒子添加flex属性，来控制子盒子的位置和排列方式 。
2. 为父盒子设置flex布局后，子元素float、clear、vertical-align属性失效。
3. 常见父元素属性：flex-direction设置主轴方向、
4. justify-content设置主轴子元素排列方式、
5. flex-wrap设置子元素是否换行、
6. align-content设置侧轴子元素排列方式多行、
7. align-items设置侧轴子元素排列方式单行、
8. flex-flow复合属性相当于flex-direction和flex-wrap
9. flex-direction属性值row从左到右row-reverse从右到左column从上到下column-reverse从下到上
10. justify-content设置主轴子元素排列方式flex-start从头部开始flex-end从尾部开始center居中对齐space-around平分剩余空间space-between先两边在平分剩余空间
11. align-items：flex-start从上到下flex-end从下到上center居中stretch拉伸
12. flex属性定义子项目分配剩余空间，表示占多少份数
13. align-self控制子项自己在侧轴上的排列方式
14. order 属性定义项目的排列顺序，数字越小越靠前。
15. 线性渐变：linear-gradient（方位，开始颜色，结束颜色）