page{ background-color: #f6f6f6; } .main{ .order_nav{ width: 100%; display: flex; justify-content: space-around; background-color: #ffffff; position: sticky; border-bottom: 1rpx solid #f6f6f6; top: 0; .order_nav_item{ font-size: 28rpx; width: 50%; padding-top: 20rpx; .order_nav_name{ width: 100%; text-align: center; height: 38rpx; color: #666666; display: flex; align-items: center; justify-content: center; } .order_nav_m{ margin: 0 auto; width: 45rpx; height: 20rpx; display: block; } } .order_nav_active{ .order_nav_name{ font-size: 32rpx; color: #333333; font-weight: 500; } .order_nav_m{ background: url(../../static/act.png); background-repeat: no-repeat; background-size: 100% 100%; } } } .cont{ margin: 20rpx 20rpx 0 20rpx; background-color: #FFFFFF; border-radius: 16rpx; padding: 0 0rpx 25rpx 0rpx; .cont_title{ font-size: 26rpx; color: #999999; margin: 0 25rpx 0 25rpx; padding:25rpx 0 25rpx 0; border-bottom: 1rpx solid #f6f6f6; } .cont_shop{ display: flex; align-items: center; justify-content: space-between; padding: 25rpx 25rpx 0rpx 25rpx ; .cont_shop_l{ display: flex; .cont_shop_img{ width: 114rpx; height: 114rpx; background: #FFFFFF; border-radius: 4rpx; border: 1rpx solid #F3F3F3; .cont_shop_imgUrl{ width: 114rpx; height: 114rpx; display: block; } } .cont_shop_m{ margin-left: 25rpx; .cont_shop_title{ font-size: 28rpx; color: #333333; font-weight: 500; } .cont_shop_text{ font-size: 26rpx; color: #999999; margin-top: 20rpx; .cont_shop_price::before{ content:'¥'; font-size: 20rpx; margin: 0rpx 5rpx 0rpx 5rpx; } .cont_shop_num{ margin-left: 20rpx; } } } } .cont_shop_r{ width: 150rpx; height: 60rpx; border-radius: 50rpx; border: 1rpx solid #999999; font-size: 24rpx; color: #666666; display: flex; align-items: center; justify-content: center; } .cont_shop_n{ height: 60rpx; border-radius: 50rpx; font-size: 26rpx; color: #666666; display: flex; align-items: center; justify-content: center; position: relative; margin-right: 25rpx; } .cont_shop_n::after{ content: ''; position: absolute; top: 50%; left: 100%; transform: translate3d(0, -50%, 0) rotate(45deg); width: 13rpx; height: 13rpx; border-top: 3rpx solid #999999; border-right: 3rpx solid #999999; } } .cont_goos{ display: flex; align-items: center; color: #FF0000; font-size: 26rpx; padding: 25rpx 25rpx 0rpx 25rpx ; .cont_goos_img{ width: 40rpx; height: 40rpx; display: block; margin-right: 10rpx; } } .cont_text{ color: #333333; font-size: 26rpx; padding: 25rpx 25rpx 0rpx 25rpx ; } .cont_ul{ display: flex; flex-wrap: wrap; .cont_li{ width: 150rpx; height: 150rpx; background: #FFFFFF; border-radius: 4rpx; border: 1rpx solid #F3F3F3; margin-left: 20rpx; margin-top: 25rpx; } .cont_li image{ width: 150rpx; height: 150rpx; border-radius: 4rpx; display: block; } } } }