5.小程序flex布局

view组件和flexbox弹性盒子模型
flex-direction: row / column 默认为row 横向布局即横向为主轴方向，纵向为副轴
flex-direction: row

flex-direction-row.png

flex-direction: column

flex-direction-column.png

1. 使用盒子布局需要首先设置 display: flex
2. 设置盒子布局方向 flex-direction: row; //横向布局 默认
3. 设置主轴方向的布局 justify-content: flex-start; //主轴开始位置
4. 设置副轴方向的布局 align-items: flex-end; //副轴从末尾开始布局

  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-end;