flex布局
1.主轴默认是水平方向, 侧轴默认是垂直方向l修改主轴方向属性: flex-direction主轴方向目标：
flex-direction改变元素排列方向属性值作用
flex-direction:row行, 水平(默认值)
flex-direction:column* 列, 垂直<常用>
flex-direction:row-reverse行, 从右向左
flex-direction:column-reverse列, 从下向上
2.Flex布局模型中，flex-direction弹性盒子默认沿着水平方向排列
x，y方向交换
<Flex布局/弹性布局：1.是一种浏览器提倡的布局模型Ø布局网页更简单、灵活;2.避免浮动脱标的问题>
3.作用：基于Flex 精确灵活控制块级盒子的布局方式，避免浮动布局中脱离文档流现象发生。
4.Flex布局非常适合结构化布局l设置方式Ø父元素添加display: flex，子元素可以自动的挤压或拉伸
5.组成部分：弹性容器，弹性盒子，主轴，侧轴/交叉轴
6.在Flex布局模型中，调节主轴或侧轴的对齐方式来设置盒子之间的间距
修改主轴对齐方式属性: justify-content 调节元素在侧轴的对齐方式align-items
修改主轴对齐方式属性: justify-content主轴对齐方式目标：使用justify-content调节元素在主轴的对齐方式属性值作用flex-start默认值, 起点开始依次排列
flex-end终点开始依次排列沿主轴居中排列
space-around弹性盒子沿主轴均匀排列, 空白间距均分在弹性盒子两侧
space-between弹性盒子沿主轴均匀排列, 空白间距均分在相邻盒子之间
space-evenly弹性盒子沿主轴均匀排列, 弹性盒子与容器之间间距相等
7.1.属性flex : 值;
2.取值分类:数值(整数)
3:注意: 只占用父盒子剩余尺寸
8.写移动端项目游乐园的步骤及注意事项
（1.建立index.less,利用@inport “./base.less和./normalize.less”。,easy less建立index.css（就可以摆脱index.css，直接在index.less书写））
（2.在html中head里面用link引进./css/index.css和./lib/iconfont/iconfont.css）
（3.引入移动适配js ： <script src="./js/flexible.js"></script>）
（4.在body中要注意分头中尾模块书写，写完就得收起来）
（5.写index.less时引入base和兼容less文件，要定量变量cttl+a全选后按alt+z可以把px改成rem）
（6.写index.less时要弄清楚// 里面的内容各占一份：flex: 1； display: flex;// 改变x,y方向。一列 flex-direction: column;
justify-content和align-items改变后的主侧轴）
（7..写index.less时要弄清楚嵌套的父盒子和子盒子之间的关系{千万谨记}）
