用途弹性框对于前端网页的布局起着决定性的作用，移动端也是如此。掌握弹性盒子的使用对于目前编写自适应页面非常重要。掌握这个布局规则是一项必备技能。弹性盒模型表示主轴（mainaxis）是沿着弹性元素放置方向延伸的轴（比如页面上的水平行和垂直列）。轴的起点和终点称为主起点和主终点**。横轴是垂直于柔性元件放置方向的轴。该轴的起点和终点称为交叉起点和交叉终点**。设置了display:flex的父元素（在本例中为）称为*flex容器。在弹性容器中充当弹性盒子的元素称为弹性项（flexitem）。常用属性1.flex-direction（指定子元素在柔性容器中的排列方式）row默认值。元素将水平显示，就像一行。row-reverse以相反的顺序。列元素将垂直显示，就像列一样。column-reverse与column相同，但顺序相反。2.flex-wrap（该属性指定flex容器是单行还是多行，横轴的方向决定了新行堆叠的方向。）nowrap的默认值。指定元素不拆分行或列。Wrap规定在必要时将元素拆分为行或列。wrap-reverse指定元素应在必要时按行或列拆分，但顺序相反。3、align-items属性定义了flex项目在flex容器当前行纵向的对齐方式，也就是指定了顶行和底行的样式。拉伸默认值。物品被拉伸以适合容器。center该项目位于容器的中心。flex-start项目位于容器的开头。flex-end项目位于容器的末尾。基线项目位于容器的基线上。4.justify-content用于设置或获取弹框元素在主轴（横轴）方向的对齐方式。flex-start项目位于容器的开头。flex-end项目位于容器的末尾。center该项目位于容器的中心。space-between项目放置在容器内，行与行之间有空白。space-around项目放置在容器中，每行之前、之间和之后都有空格。灵活的子元素属性1.orderattribute.flex-container.flex-item{order:;}：整数值用于定义排列顺序，较小的值排在最前面。可以为负值，默认为0。2.align-self设置或获取弹性盒子元素自身在横轴（纵轴）方向的对齐方式。（类似于对齐项）
