flex子项目在主轴的缩放比例，不指定flex属性，则不参与伸缩分配
1、设置 flex 缩放的 限定值
min-width 最小值 min-width：280px 最小宽度不能小于280px
max-width 最大值 max-width：1280px 最大宽度不能大于1280px
2、flex-direction 调整主轴方向（默认水平方向）
column 垂直排列
column-reverse 对齐方式与 column相反
row 水平排列
row-reverse 对齐方式与 row 相反
3、justify-content调整主轴对齐方式（水平对齐）
flex-start，默认值，相当于左对齐，盒子顺序不变
flex-end，相当于右对齐，盒子顺序不变
center，相当于居中显示
space-between，左右的盒子贴近父盒子，中间的平均分布空白间距
space-around，相当于给每个盒子添加了左右 margin 外边距
4、align-items调整侧轴对齐（垂直对齐（单行））
stretch，默认值，让子元素的高度拉伸适用父容器（子元素不给高度的前提下）
center，垂直居中
flex-start，上对齐
flex-end，底对齐
5、flex-wrap控制是否换行，当子盒子内容宽度多余父盒子时如何处理
wrap，拆行显示
wrap-reverse，拆行，以相反的顺序显示
6、flex-flow 是 flex-direction、flex-wrap 的简写形式
flex-flow：flex-direction flex-wrap；
白话记忆：flex-flow：排列方向 换不换行；两个中间用空格
7、align-content 堆栈（由flex-wrap 产生的独立行）多行垂直对齐方式
stretch，默认值，盒子被拉伸以适应容器
center，居中显示
flex-start，头对齐
flex-end，底对齐
space-between，项目位于各行之间留有空白的容器内
space-around，项目位于各行之前，之间，之后都留有空白的容器内
例如：
display：flex；
flex-flow：row wrap；
align-content：center； // 设置完 上面两个条件，多行垂直才会起作用
必须对父元素设置自由盒属性 display：flex，并且设置排列方式为横向排列 flex-direction：row；
并设置换行，flex-wrap：wrap；这样才会起作用
8、order 控制子项目的排列顺序，正序方式排序，从小到大。
用整数值来定义排列顺序，数值小的排在前面，可以是负值，默认值是0
order：1；
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [email protected] 举报，一经查实，本站将立刻删除。
