.page{ display: flex; flex-direction: column; } .titlebox{ background-color: #fff; padding:30rpx 30rpx; border-bottom:2rpx solid #E3E4E5 } .expresscon{ flex:1; margin-top: 192rpx; overflow: scroll; -webkit-overflow-scrolling: touch; } .row{ display: flex; align-items: center; } .row:first-child{ margin-bottom:20rpx; } .copy{ width: 80rpx; height: 40rpx; background: #FFFFFF; border-radius: 20rpx; border: 1rpx solid #CCCCCC; display: flex; justify-content: center; align-items: center; font-size: 28rpx; font-weight: 400; color: #666666; margin-left: 20rpx; } .box{ background-color: #fff; overflow: hidden; } .expressdesc{ position: relative; padding:0rpx 30rpx 20rpx; margin:64rpx 0 0rpx } .cell{ position: relative; display: flex; min-height:140rpx; } .step{ width:38rpx; height:38rpx; top:0rpx; left:95rpx; position: absolute; } .circle{ width:20rpx; position: absolute; top:11rpx; background: #DCDEE0; left:105rpx; height:20rpx; border-radius: 50%; } .expressdesc .date{ margin-top: 5rpx; color: #999999; } .expressdesc .date.active{ color: #323233; } .expressdesc .day{ white-space: nowrap; font-size: 30rpx; } .line{ top:0; width: 4rpx; left:142rpx; background: #DCDEE0; bottom:0; position: absolute; } .cell .date{ display: flex; flex-direction: column; text-align: right; justify-content: flex-start; } .expressdesc .time{ margin-top: 10rpx; font-size: 24rpx; white-space: nowrap; } .expressdesc .desc{ margin-left: 80rpx; font-size: 30rpx; color:#999; line-height: 40rpx; margin-bottom: 40rpx; } .expressdesc .desc.active{ color: #323233; } .tips { font-size: 28rpx; color: #666666; text-align: center; } .tips .tip:first-child{ margin-bottom:25rpx; } .go{ margin:30rpx auto; width: 261rpx; height: 86rpx; background: #FFFFFF; display: flex; justify-content: center; align-items: center; border-radius: 8rpx; border: 1rpx solid #979797; }