【css3】弹性盒子模型

简介

弹性盒子模型可以替代浮动模型，免去了手动计算间隙和清除浮动的繁杂操作，各种布局轻松应对

还是应了那句话：越好的东西兼容性越差
唯一的不足就是不兼容ie10以下，要兼容性的还是用浮动模型为妙

是一种当页面需要适应不同的屏幕大小以及设备类型时确保元素拥有恰当的行为的布局方式
引入弹性盒布局模型的目的是提供一种更加有效的方式来对一个容器中的子元素进行排列、对齐和分配空白空间。

在父容器添加 display：flex 即可触发子元素浮动

设置排列方向 flex-direction

row | row-reverse | column | column-reverse

设置内容对齐flex-direction

flex-start | flex-end | center | space-between | space-around | space-evenly

后面三个值依次如下：space-between | space-around | space-evenly