direction

修改元素排列方式，可单独使用，会影响子元素内部元素排列

• rtl
  1

  2

  3

flex-direction

弹性子元素在父容器中的位置

• row-reverse
  1

  2

  3
• column-reverse
  1

  2

  3

justify-content

弹性子元素（横向）排列方式，可单独使用，会影响子元素内部元素排列

• flex-start
  1

  2

  3
• flex-end
  1

  2

  3
• center
  1

  2

  3
• space-between
  1

  2

  3
• space-around
  1

  2

  3
• space-evenly
  1

  2

  3

align-items

设置或检索弹性盒子元素在侧轴（纵轴）方向上的对齐方式

• flex-start
  1

  2

  3
• flex-end
  1

  2

  3
• center
  1

  2

  3

flex-wrap

指定弹性盒子的子元素换行方式

• wrap
  1

  2

  3

  4

  5

  6

  7
• wrap-reverse
  1

  2

  3

  4

  5

  6

  7

align-content

修改 flex-wrap 属性的行为,设置各个行的对齐

• flex-start
  1

  2

  3

  4

  5

  6

  7
• flex-end
  1

  2

  3

  4

  5

  6

  7
• center
  1

  2

  3

  4

  5

  6

  7
• space-between
  1

  2

  3

  4

  5

  6

  7
• space-around
  1

  2

  3

  4

  5

  6

  7
• space-evenly
  1

  2

  3

  4

  5

  6

  7

css3弹性盒子常用样式属性梳理汇总