Flex弹性盒笔记

Flex（弹性盒）是CSS中的新布局手段，它主要用来代替浮动来完成页面的布局。
Flex可以使元素具有弹性，让元素可以跟随页面的大小而改变

弹性容器

要使用弹性盒，必须先将一个元素设置为弹性容器。
可以通过Display来设置弹性容器

display:flex  //设置为块级弹性容器
display:inline-flex //设置为行内弹性容器

弹性元素

弹性容器的直接子元素是弹性元素，后代不是弹性元素。
一个元素可以同时是弹性容器和弹性元素。

flex-direction
指定容器中弹性元素的排列方式。
row：默认值，弹性元素在容器中水平排列。
row-revers：弹性元素在容器中反向水平排列。
column：弹性元素纵向排列
column-reverse：弹性元素纵向反向排列。

主轴

侧轴