ColorUI仿写了一个家装小程序首页

用ColorUI仿写了一个家装小程序首页，git地址是：https://gitee.com/laeser/dress-wx，欢迎拍砖。

优点

ColorUI是一个CSS框架，类似于Bootstrap，不是一个组件框架，如Vant weapp。它特别好用，命名通俗易懂，很是优雅，定义好了一系列样式，比如margin padding flex，开箱即用，棒，感谢作者倾情付出。

示例

贴上一段页头卡页的wxml了解一下大概。

<view class="margin padding-sm bg-white radius shadow shadow-lg">
  <view class="flex justify-between">
    <!-- 头像 -->
    <view class="cu-avatar xl round margin-lr-xs" style="background-image:url(/static/images/logo.png);"></view>
    <!-- 文本内容 -->
    <view>
      <view>
        <text class="block text-xl">瑞安市灵犀家居装饰有限公司</text>
        <text class="block text-grey">瑞安市玉海街道望欣路204号</text>
        <text class="block text-green">18658350723</text>
      </view>
    </view>
  </view>
  <!-- 围观 -->
  <view class="padding-sm flex justify-between align-center">
    <view class="cu-avatar-group">
      <view class="cu-avatar round lg" wx:for="{{6}}" wx:key style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big1000{{index+1}}.jpg);"></view>
    </view>
    <text>等101人围观</text>
  </view>
</view>

首页效果

dress.png

我的公众号

关注订阅号【黄秀杰】，了解更多小程序前端文章视频