微信小程序flex box界面设计入门到精通-04课-flex容器属性-flex-flow属性

.box { flex-flow: <flex-direction> || <flex-wrap>; }

<view class='zong'>

  <view class='fangxing'>

    <text>01</text>

  </view>

  <view  class='fangxing'>

    <text>02</text>

  </view>

  <view  class='fangxing'>

    <text>03</text>

  </view>

  <view  class='fangxing'>

    <text>04</text>

  </view>

  <view  class='fangxing'>

    <text>05</text>

  </view>

</view>

/*

flex-flow属性是flex-direction属性和flex-wrap属性的简写形式，默认值为row  nowrap

flex-flow: <flex-direction> || <flex-wrap>; 

*/

.zong{

  display: flex;

  flex-flow: wrap;

}

.fangxing{

  width: 100px; height: 100px; 

  background-color:  #f5f5dc;

  margin: 10px;/*每个方框的外边距*/

}