ax-body { display: block; height: 100%; /* background: #F5F7FB; */ } ax-body .ax-custom-title { background-color: #fff !important; } /* 选项卡start */ .tabs-box { z-index: 9999; position: fixed; width: 100%; left: 0; height: 100rpx; background-color:#C7FFFD; display: flex; align-items: center; text-align: center; gap: 20rpx; } .item-tabs { flex: 1; height: 80rpx; line-height: 80rpx; position: relative; color: #B1B1B1; font-size: 28rpx; } .item-tabs:after { content: ''; position: absolute; left: 50%; /* 水平起点居中 */ -webkit-transform: translateX(-50%); transform: translateX(-50%); /* 向左偏移自身50%宽度,实现水平居中 */ bottom: 0; width: 0; height: 8rpx; border-radius: 10rpx; background-color: #3EB6F8; opacity: 0; transition: opacity 0.5s; transition: width 0.3s; } .item-tabs.active { color: #2B303A; font-weight: bold; } .item-tabs.active:after { width: 48rpx; opacity: 1; } /* 选项卡end */ .list-body { } .coupons-list-box { margin: auto; margin-top: 20rpx; position: relative; overflow: hidden; height: 196rpx; width: 702rpx; } .coupons-list-box .coupons-bg-img { position: absolute; height: 196rpx; width: 100%; } .coupons-content-box { position: absolute; display: flex; height: 196rpx; } .coupons-content-box .coupons-left { margin-top: 24rpx; width: 180rpx; text-align: center; margin-left: 14rpx; } .left-price { font-weight: 800; font-size: 50rpx; color: #FFFFFF; } .left-price text { font-size: 28rpx; } .left-rules { height: 46rpx; line-height: 46rpx; margin-top: 20rpx; background-color: #fff; border-radius: 24rpx; font-size: 24rpx; color: #FF6457; text-align: center; } .coupons-center { text-align: center; margin-left: 30rpx; margin-top: 24rpx; width: 280rpx; } .coupons-title { font-weight: 800; font-size: 28rpx; color: #222222; } .coupons-valid { margin-top: 16rpx; font-size: 22rpx; color: #AAAAAA; } .coupons-range { margin-top: 16rpx; font-size: 24rpx; color: #222222; } .coupons-right { margin-top: 58rpx; margin-left:50rpx; } .coupons-dayrules { font-size: 20rpx; color: #AAAAAA; } .coupons-getbtn { margin-top:22rpx; height: 44rpx; width: 136rpx; text-align: center; line-height: 44rpx; background: #FF6457; border-radius: 22rpx; font-size: 24rpx; color: #FFFFFF; } .ribbon { width: 160rpx; height: 30rpx; background: #FF6457; position: absolute; right: -44rpx; top: 20rpx; -webkit-transform: rotateZ(45deg); transform: rotateZ(45deg); text-align: center; color: #fff; font-size: 20rpx; } .not-data{ margin-top: 200rpx; display: flex; align-items: center; justify-content: center; flex-direction: column; font-size: 14px; color: #ccc; } .not-data .icon{ display: block; width: 25vw; margin-bottom: 10px; }