|
|
@@ -8,9 +8,10 @@
|
|
|
<!-- 卡片 -->
|
|
|
<view class="main">
|
|
|
<view class="card-1">
|
|
|
+ <view class="tag">新客福利</view>
|
|
|
<view class="price">
|
|
|
<view class="current-price">
|
|
|
- 99<text>元/月</text>
|
|
|
+ 59.9<text>元/月</text>
|
|
|
</view>
|
|
|
<view class="radio-box">
|
|
|
|
|
|
@@ -25,6 +26,7 @@
|
|
|
|
|
|
</view>
|
|
|
<view class="card-2">
|
|
|
+ <view class="tag">限时5折</view>
|
|
|
<view class="price">
|
|
|
<view class="current-price">
|
|
|
99<text>元/月</text>
|
|
|
@@ -119,16 +121,44 @@
|
|
|
.main{
|
|
|
background-color: #404A5E ;
|
|
|
padding: 20px 20px 30px 20px;
|
|
|
+ .tag{
|
|
|
+ position: absolute;
|
|
|
+ background-color: rgba(255, 61, 0, 100);
|
|
|
+ color: #ffffff;
|
|
|
+ font-size: 12px;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 20px;
|
|
|
+ padding: 0 6px;
|
|
|
+ left: 284rpx;
|
|
|
+ top: 44rpx;
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+ @media screen and (max-width:320px){
|
|
|
+ .tag{
|
|
|
+ padding: 0 4rpx;
|
|
|
+ }
|
|
|
+ .price{
|
|
|
+ position: absolute;
|
|
|
+ top:24rpx !important;
|
|
|
+ right: 8rpx !important;
|
|
|
+ }
|
|
|
+ .current-price{
|
|
|
+ font-size: 36rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
.price{
|
|
|
- float: right;
|
|
|
- margin: 32rpx 32rpx 0;
|
|
|
+ top:24rpx;
|
|
|
+ right: 32rpx;
|
|
|
+ position: absolute;
|
|
|
}
|
|
|
.current-price{
|
|
|
- font-size: 32px;
|
|
|
+ font-size: 64rpx;
|
|
|
color: #101010;
|
|
|
+ text-align: right;
|
|
|
|
|
|
text{
|
|
|
- font-size: 14px;
|
|
|
+ font-size: 28rpx;
|
|
|
|
|
|
}
|
|
|
}
|
|
|
@@ -138,7 +168,7 @@
|
|
|
|
|
|
}
|
|
|
/deep/.u-iconfont{
|
|
|
- font-size: 18px !important;
|
|
|
+ font-size: 36rpx !important;
|
|
|
|
|
|
}
|
|
|
|
|
|
@@ -146,9 +176,9 @@
|
|
|
|
|
|
.card-1{
|
|
|
background: url(@/assets/img/card_normal.png) no-repeat ;
|
|
|
-
|
|
|
+ position: relative;
|
|
|
background-size:cover;
|
|
|
- height: 150px;
|
|
|
+ height: 300rpx;
|
|
|
/deep/.u-checkbox__icon-wrap{
|
|
|
background-color: #446D94 ;
|
|
|
}
|
|
|
@@ -159,10 +189,11 @@
|
|
|
}
|
|
|
}
|
|
|
.card-2{
|
|
|
+ position: relative;
|
|
|
background: url(@/assets/img/card_operate.png) no-repeat ;
|
|
|
background-size:cover;
|
|
|
- height: 150px;
|
|
|
- margin-top: 16px;
|
|
|
+ height: 300rpx;
|
|
|
+ margin-top: 32rpx;
|
|
|
/deep/.u-checkbox__icon-wrap{
|
|
|
background-color: #B29467 ;
|
|
|
}
|
|
|
@@ -236,7 +267,7 @@
|
|
|
.notice{
|
|
|
background-color: #fff;
|
|
|
margin-top: 12px;
|
|
|
- padding: 20px 20px 30px 30px;
|
|
|
+ padding: 20px 20px 72px 30px;
|
|
|
/deep/.u-divider{
|
|
|
margin-bottom: 16px !important;
|
|
|
}
|
