.commodityBox{ width:96%; margin: 20rpx auto 0 auto; background-color: #ffffff; overflow: hidden; border-radius: 10rpx; } .commodiImg{ float: left; width: 300rpx; height: 176rpx; border-radius: 10rpx; /* background-color: aqua; */ margin: 20rpx; } .img{ width: 300rpx; height: 176rpx; border-radius: 10rpx; } .textBox{ width: 50%; float: left; margin-top: 20rpx; font-size: 28rpx; } .title{ height: 80rpx; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; font-size: 30rpx; font-weight: 500; } .marketBox{ overflow: hidden; height: 40rpx; } .progress{ height: 20rpx; width: 46%; border-radius: 10rpx; float: left; background-color: #e6e6e6; margin-top: 10rpx; position: relative; overflow: hidden; } .progress_a{ /* width: 20%; */ height: 20rpx; /* border-radius: 10rpx; */ background-color: #fb3e5c; position: absolute; top: 0; left: 0; } .progressText{ float: right; width: 50%; font-size: 26rpx; color: #707070; } .payBox{ overflow: hidden; } .payNumBox{ float: left; /* overflow: hidden; height: 40rpx; */ } .payIcon{ font-size: 24rpx; float: left; color: #fb3e5c; line-height: 40rpx; } .price{ height: 40rpx; line-height: 40rpx; float: left; font-size: 30rpx; color: #fb3e5c; } .original{ font-size: 26rpx; color: #707070; text-decoration: line-through; } .payBtn{ color: #fff; background:linear-gradient(to right,#fc3e5a,#f86883); float: right; margin-right: 10%; margin-top: 20rpx; height: 60rpx; line-height: 60rpx; width: 180rpx; text-align: center; border-radius: 60rpx; margin-bottom: 20rpx; } .noBtn{ color: #fff; background:#e6e6e6; float: right; margin-right: 10%; margin-top: 20rpx; height: 60rpx; line-height: 60rpx; width: 180rpx; text-align: center; border-radius: 60rpx; margin-bottom: 20rpx; }