小程序-主题

 

<view class="theme-view home-view">
  <view class="theme-view-item" wx:for="{{themeArr}}" wx:key>
    <image class="theme-view-item-img" src="{{item.url}}" mode='aspectFill'></image>
    <text class="theme-view-item-text">{{item.text}}</text>
  </view>
</view>

.theme-view {
  text-align: center;
  border-radius: 10rpx;
  margin-bottom: 20rpx;
}

.theme-view-item {
  padding-bottom: 30rpx;
  padding-top: 30rpx;
  width: 130rpx;
  display: inline-block;
  text-align: center;
}

.theme-view-item-img {
  margin-left: 20rpx;
  width: 80rpx;
  height: 80rpx;
  margin-bottom: 10rpx;
  background: #F8E2E2;
  border-radius: 50%;
  display: block;
}

.theme-view-item-text {
  font-size: 22rpx;
  font-family: 100rpx;
  color: #333333;
  width: 100rpx;
  text-align: center;
}