一个【动态类名】样式还会存在兼容性问题吗?
发布于 5 年前 作者 fujun 10797 次浏览 来自 问答
  • 当前 Bug 的表现(可附上截图)
  • 预期表现
  • 复现路径
  • 提供一个最简复现 Demo

【CSS】

.skuInfo-attr-value{

display: inline-block;

min-width: 200rpx;

height: 60rpx;

line-height: 60rpx;

font-size: 24rpx;

border-radius:30rpx;

text-align: center;

margin:20rpx 30rpx 0 0;

box-sizing: border-box;

padding:0 30rpx;

color:#000;

border:1px solid #999;

background-color: #fff;

overflow: hidden;

}

/* 可选(默认) */

.skuInfo-attr-value-selected1{

color:#000;

border:1px solid #999;

background-color: #fff;

}

/* 可选点击颜色 */

.skuInfo-attr-value-selected2{

color: #fff;

border:1px solid #F0445C;

background-color: #F0445C;

}

/* 不可选默认颜色 */

.skuInfo-attr-value-selected3{

color: #999;

border:1px dashed #999;

background-color: #fff;

}

/* 不可选点击颜色 */

.skuInfo-attr-value-selected4{

color: #F0445C;

border:1px dashed #F0445C;

background-color: #fff;

}

【HTML】

<scroll-view scroll-y class=“skuInfo-scroll”>

<view class=“skuInfo-attr” wx:for="{{info.productAttr}}" wx:key=“item”>

<view class=“skuInfo-attr-name”>{{item.saleName}}</view>

<view class=“skuInfo-attr-value-group”>

<text

class=“skuInfo-attr-value {{‘skuInfo-attr-value-selected’ + items.status}}”

wx:for="{{item.saleAttrList}}"

wx:for-item=“items”

wx:key=“items”

data-index = “{{index}}”

data-item="{{items}}"

bindtap=“onTapAttr”>{{items.saleValue}}</text>

</view>

</view>

</scroll-view>

回到顶部