.order-detail-page { background: #f0f0f0; .block { position: relative; background: #fff; padding: 20rem / $pxConvertRem 30rem / $pxConvertRem; .iconfont { position: absolute; left: 30rem / $pxConvertRem; top: 50%; font-size: 40rem / $pxConvertRem; margin-top: -30rem / $pxConvertRem; } } .sub { position: relative; .iconfont { left: 0; } } .logistics { display: block; .icon-right { right: 25rem / $pxConvertRem; left: auto; color: #b0b0b0; } .sub-content { border-top: 1px solid #e0e0e0; margin-top: 20rem / $pxConvertRem; padding-top: 20rem / $pxConvertRem; } } .owner-info { border-bottom: 1px solid #e0e0e0; line-height: 1.5; } .beside-icon { margin-left: 60rem / $pxConvertRem; } .name-phone { font-size: 30rem / $pxConvertRem; span { float: right; } } .address { font-size: 24rem / $pxConvertRem; margin-top: 10rem / $pxConvertRem; } .order-status { margin: 20rem / $pxConvertRem 0; border-top: 1px solid #e0e0e0; border-bottom: 1px solid #e0e0e0; padding-right: 0; } .sub-content span { display: block; color: #b0b0b0; font-size: 24rem / $pxConvertRem; } .sub-content .sub-title { display: block; color: #000; font-size: 26rem / $pxConvertRem; } .goods { padding: 0; margin-top: 20rem / $pxConvertRem; border-top: 1px solid #e0e0e0; border-bottom: 1px solid #e0e0e0; } .cost { // margin-bottom: 100rem / $pxConvertRem; /*排除被固定底部遮挡的影响*/ li { font-size: 28rem / $pxConvertRem; span { float: right; } &:last-child span { color: #f00; } } } .opt { // 测试反馈 底部不需要固定 // position: fixed; // bottom: 0; // left: 0; // right: 0; text-align: right; border-top: 1px solid #e0e0e0; } .btn { display: inline-block; box-sizing: border-box; width: 140rem / $pxConvertRem; height: 60rem / $pxConvertRem; line-height: 60rem / $pxConvertRem; @include border-radius(5px); font-size: 26rem / $pxConvertRem; text-align: center; border: 1px solid #000; } .btn-pay { color: #fff; border: none; background: #d0021b; margin-left: 10rem / $pxConvertRem; } }