容器

  1. flex-direction:row(改变主轴的方向,并不是把子元素(flex项)从主轴移到交叉轴上对齐,而是让主轴自身从水平变成垂直)
  2. flex-wrap:nowrap(是否换行)
  3. flex-flow:row nowrap(复合属性=方向 换行=flex-drection flex-wrap)
  4. justify-content:flex-start(元素在主轴上的对齐,主轴可能水平,也可以垂直)
  5. align-content:stretch(交叉轴,对齐轴线!flex-wrap 会影响,如果=wrap,即使只有一行,也会起作用。若=nowrap,则不起作用!对齐轴线,多根轴线的对齐方式)
  6. align-items:stretch(元素在每个交叉轴上的对齐,只作用在每一轴线上):

元素

  1. flex-grow:0
  2. flex-shrink:1
  3. flex-basis:auto
  4. flex:0 1 auto
  5. align-self: auto | flex-start | flex-end | center | baseline | stretch;
  6. order: 控制项目在 flex 容器中的显示顺序
div>