微信小程序14__布局Flex-Direction，Flex-Wrap,Justify-Content

Flex 布局, 要深刻理解

首先看一个图

 

1. flex-direction
   代表排列方向， 决定主轴的方向,   在wxss文件中，如果这样定义
   
   flex-direction:row   // 表示从左到右排列
   
   flex-direction:row-reverse  // 表示从右到左排列
   
   flex-direction:column    //表示从上到下排列
   
   flex-direction:column-reverse   //表示从下到上排列
    
2. flex-wrap
   代表是否换行， 默认值为nowrap 表示不换行
   flex-wrap:nowrap 表示不换行
   
   flex-wrap: wrap 表示换行
   
   看效果图