flex基础快速入门

Flex 是 Flexible Box 的缩写，意为"弹性布局"。

任何一个容器都能使用flex布局。行内元素也可以。

.box{
    display: flex;}

.box{
    display: inline-flex;}

flex布局分为两块：

1. 容器：flex container
2. 项目：flex item

容器默认存在两根轴：水平的主轴（main axis）和垂直的交叉轴（cross axis）。

1、容器属性：

（1）flex-direction：主轴的方向

row（默认