微信小程序weui在线入门教程-WeUi基础组件-flex布局

  <view class="page__hd">

    <view class="page__title">Flex</view>

    <view class="page__desc">Flex布局</view>

  </view>

  <view class="page__bd page__bd_spacing">

    <view class="weui-flex">

      <view class="weui-flex__item">

        <view class="placeholder">weui</view>

      </view>

    </view>

    <view class="weui-flex">

      <view class="weui-flex__item">

        <view class="placeholder">weui</view>

      </view>

      <view class="weui-flex__item">

        <view class="placeholder">weui</view>

      </view>

    </view>

    <view class="weui-flex">

      <view class="weui-flex__item">

        <view class="placeholder">weui</view>

      </view>

      <view class="weui-flex__item">

        <view class="placeholder">weui</view>

      </view>

      <view class="weui-flex__item">

        <view class="placeholder">weui</view>

      </view>

    </view>

    <view class="weui-flex">

      <view class="weui-flex__item">

        <view class="placeholder">weui</view>

      </view>

      <view class="weui-flex__item">

        <view class="placeholder">weui</view>

      </view>

      <view class="weui-flex__item">

        <view class="placeholder">weui</view>

      </view>

      <view class="weui-flex__item">

        <view class="placeholder">weui</view>

      </view>

    </view>

    <view class="weui-flex">

      <view>

        <view class="placeholder">weui</view>

      </view>

      <view class="weui-flex__item">

        <view class="placeholder">weui</view>

      </view>

      <view>

        <view class="placeholder">weui</view>

      </view>

    </view>

  </view>

</view>