这两段是wxml和wxss代码
<!--pages/access/selectCabinet/selectCabinet.wxml--> <view class='top-horizontal-line' /> <view class='container'> <view class='cabinet-desc'>{{selectCabinetDesc}}</view> <view class='container-content'> <view class='cabinet-p' style="height:{{scrollHeight}}px;{{boxList.length==1 ? 'justify-content: center;' : 'justify-content: space-between;'}} "> <view wx:for='{{boxList}}' wx:key='item' class="{{item.bindStatus==0 ? 'cabinet-bg-green' : 'cabinet-bg-gray'}} " data-item='{{item}}' bindtap='onOpen'>{{item.name}}</view> </view> </view> </view>
/* pages/access/selectCabinet/selectCabinet.wxss */ .cabinet-desc { width: 100%; font-size: 36rpx; text-align: center; color: #222; margin-top: 24rpx; } .container-content { width: 100%; height: auto; align-items: center; justify-content: center; display: flex; } .cabinet-p { width: 480rpx; display: flex; justify-content: center; align-items: center; flex-flow: row wrap; align-content: center; min-height: max-content; } .cabinet-bg-green { width: 180rpx; height: 180rpx; color: #ffffff; font-size: 56rpx; border-radius: 50%; background: #4ec282; text-align: center; line-height: 180rpx; margin-top: 20rpx; margin-bottom: 30rpx; margin-left: 30rpx; margin-right: 30rpx; } .cabinet-bg-gray { width: 180rpx; height: 180rpx; color: #ffffff; font-size: 56rpx; border-radius: 50%; background: #eee; text-align: center; line-height: 180rpx; margin-top: 20rpx; margin-bottom: 30rpx; margin-left: 30rpx; margin-right: 30rpx;