.top { width: 100%; height: 140rpx; background-color: #26A2FF; margin-bottom: 70rpx; color: #fff; text-align: center; } .top image{ width: 36rpx; height: 36rpx; margin-right: 10rpx; position: relative; top: 6rpx; } .dates{ width: 200rpx; margin: 0 auto; text-align: center; } .head{ position: absolute; top: 70rpx; left: 32rpx; right: 32rpx; border-radius: 20rpx; background-color: #fff; box-shadow: 0 0.04rem 0.12rem 0 rgba(0,0,0,.05); height: 140rpx; text-align: center; } .head .flex-1 view:nth-child(1){ color: #26A2FF; font-weight: 600; margin-bottom: 10rpx; font-size: 44rpx; } .head .flex-1 view:nth-child(2){ color: #C0C4CC; margin-bottom: 5rpx; font-size: 28rpx; } .headed{ background-color: #fff; } .headed-box{ padding:28rpx; color: #303133; } .title{ color: #222; position: relative; padding: 0rpx 16rpx 28rpx 16rpx; font-size: 32rpx; } .title::before{ position: absolute; content: ""; height: 24rpx; left: 0; top: 5rpx; width: 6rpx; background-color: #26A2FF; border-radius: 50rpx; } .f2-chart { width: 100%; height: 400rpx; } /* 底部 */ .main{ padding: 28rpx; background-color: #fff; } .list{ padding: 28rpx 0; border-top: 1px solid #f1f1f1; } .text{ margin-right: 10rpx; color: #303133; font-size: 32rpx; } .main .gengduo image{ width: 24rpx; height: 24rpx; position: relative; top: 4rpx; } .gengduo{ color: #303133; font-size: 32rpx; } .num{ font-size: 40rpx; } .dates text::after{ position: absolute; /* position: relative; */ top: 50%; right: -20rpx; margin-top: -0.1rem; border: 0.06rem solid; border-color: transparent transparent #fff #fff; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); opacity: .8; content: ''; } .dates .activeView::after { margin-top: -0.02rem; -webkit-transform: rotate(135deg); transform: rotate(135deg); border-color: transparent transparent #fff #fff; }