微信小程序（Flex布局-项目属性）

容器内的元素简称为“项目”或者“元素”

项目属性集合：order、flex-grow、flex-shrink、flex-basis、flex、align-self

♤♤项目属性♤♤：
①沿主轴方向上的排列顺序order: 0（默认值） | <integer整数>

②项目的收缩因子flex-shrink: 1（默认值） | <数字>

③项目的扩张因子flex-grow: 0（默认值） | <数字>

④项目width属性替代品flex-basis: auto（默认值） | <数字>px

⑤flex-grow、flex-shrink、flex-basis的简写方式：flex 属性

⑥项目在行中交叉轴方向上的对齐方式align-self: auto（默认值） | flex-start | center | flex-end | baseline |stretch。

逐个介绍：

order属性

作用：
设置项目沿主轴方向上的排列顺序，数值越小，排列越靠前，属性值为整数。

<!-- 弹性布局---项目属性 -->
<view class="ele">
  <view class="one">1项目属性</view>
  <view class="two">2</view>
  <view class="three">3</view>
</view>

.ele{
  width:320px;
  height:100px;
  background:blanchedalmond;
  display: flex;
  flex-direction:row;
  margin-bottom: 200px;
}

.ele .one{
  width: 100px;
  order: 3;

}
.ele .two{
  width: 100px;
  background:rgb(17, 21, 194)
  order: 2;

}
.ele .three{
  width: 100px;
  order: 1;
}