flex布局前提条件--display: flex（react native 不用设置）
- 与flex布局相关的属性有以下几个：（说几个主要的）
- flex-direction 主轴方向
- row （default value）web开发
- row-reverse
- column （default value）react native开发
- column-reverse
- justify-content 容器内的元素在主轴方向的排列方式
- flex-start （default value）
- flex-end
- center
- space-between
- space-around
- align-items 容器内的元素在交叉轴方向的排列方式
- flex-start
- flex-end
- center
- stretch （default value）
- align-content（注意：容器内必须有多行的项目，该属性才能渲染出效果。今天只讨论单行的情况，也就是不换行，flex-wrap: no-wrap）
- flex-wrap
下面说说flex-direction: row，row-reverse的情况，column，column-reverse以此类推
灰色画布 宽1200px 高 600px
cyan色矩形块 宽250px 高 100px
flex-direction: row
justify-content: flex-start; alignItems: flex-start;
Screen Shot 2019-08-31 at 00.20.34.png
- justify-content: flex-start; alignItems: center
Screen Shot 2019-08-31 at 00.23.09.png
-
justify-content: flex-start; alignItems: flex-end
Screen Shot 2019-08-31 at 00.23.40.png
- justify-content: flex-start; alignItems: center;
Screen Shot 2019-08-31 at 00.39.05.png
- justify-content: flex-end; alignItems: center;
Screen Shot 2019-08-31 at 00.29.15.png
- justify-content: center; alignItems: center;
Screen Shot 2019-08-31 at 00.39.39.png
- justify-content: space-between; alignItems: center;
Screen Shot 2019-08-31 at 00.40.47.png
- justify-content: space-around; alignItems: center;
Screen Shot 2019-08-31 at 00.41.16.png
暂时写这么多 可以一起探讨呀
