.content { padding-bottom: 180rpx; } /* 封面图 */ .cover { position: relative; padding-top: 70%; background: #f7f8f9; } .cover-src { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* 信息 */ .info { padding: 40rpx; } .info-title { font-weight: bold; font-size: 50rpx; margin-bottom: 20rpx; line-height: 65rpx; color: #333; text-align: justify; } .info-subtitle { font-size: 30rpx; line-height: 50rpx; margin-bottom: 40rpx; color: #333; text-align: justify; } .info-info { background: #f7f8f9; padding: 0 30rpx; font-size: 30rpx; border-radius: 20rpx; } .info-info-item { padding: 30rpx 0; line-height: 40rpx; display: flex; justify-content: space-between; } label { font-weight: bold; width: 170rpx; } .info-info-item:last-child::after { display: none; } .info-value { width: calc(100% - 170rpx); text-align: right; font-family: Arial, Helvetica, sans-serif; } .info-value.price { font-weight: bold; color: #da2b56; } /* 底部 */ .footer { position: fixed; bottom: 0; left: 0; right: 0; padding: 30rpx 30rpx 50rpx; display: flex; flex-wrap: wrap; align-items: center; z-index: 99; background-color: white; box-shadow: 0 0 10rpx 10rpx rgba(0, 0, 0, .04); } .footer-btn { background: #da2b56; color: white; line-height: 100rpx; border-radius: 50rpx; flex: 1; text-align: center; font-weight: bold; font-size: 36rpx; } .footer-btn.in { opacity: .6; }