.header { position: fixed; width: 100%; height: .9rem; left: 0; top: 0; background: url("../img/header_back.png"); background-size: cover; display: flex; align-items: center; justify-content: space-between; padding: 0 0.19rem; box-sizing: border-box; } .header .back { width: 0.34rem; height: 0.34rem; } .header .home { width: 0.32rem; height: 0.32rem; } .header p { font-size: 0.4rem; font-weight: bold; letter-spacing: 0.016rem; color: #ffffff; } .footer { position: fixed; width: 100%; height: 1.47rem; background-color: #ffffff; left: 0; bottom: 0; display: flex; justify-content: space-between; } .footer_nums { display: flex; align-items: center; padding-left: 0.46rem; } .footer_nums .car_icon{ position: relative; } .footer_nums .car_icon img{ width: 0.77rem; height: 0.73rem; } .footer_nums .price{ font-size: 0.36rem; color: #666666; margin-left: 0.51rem; } .footer_nums .price span{ color: #ff5400; } .footer_submit { width: 3.15rem; height: 1.47rem; background-color: #ed1755; font-family: SourceHanSansCN-Regular; font-size: 0.491rem; color: #ffffff; text-align: center; line-height:1.47rem; } .content { height: calc(100vh - .9rem - 1.47rem); margin-top: .9rem; display: flex; } .menu { width: 2.95rem; background-color: #f7f7f7; overflow-y: scroll; } .menu ul li{ height: 1.31rem; border-bottom: 1px solid #ddd; font-size: 0.393rem; color: #2a2a2a; text-align: center; line-height: 1.31rem; border-right: 1px solid #ddd; position: relative; } .menu ul li .nums{ right: 0.19rem; top: 0.16rem; width: 0.37rem; height: 0.37rem; font-size: 0.229rem; display: flex; align-items: center; justify-content: center; } .nums span { zoom: 0.7; } .menu ul .active { border-right: none; color: #ff5400; border-left: 0.13rem solid #ed1755; } .list { padding:0 0.32rem; flex: 1; overflow-y: scroll; } .list li { display: flex; border-bottom: 0.03rem solid #eeeeee; padding-bottom: 0.35rem; padding-top: 0.37rem; } .list li img { width: 2.47rem; height: 1.97rem; margin-right: 0.41rem; } .list li .list_right {} .list li .list_right .add{ display: flex; align-items: center; justify-content: flex-end; font-size: 0; } .list li .list_right .add .reduce{ width: 0.66rem; height: 0.66rem; background-color: #fff; border-radius: 0.04rem; border: solid 0.02rem #ff7800; font-size: 0.59rem; color: #ff7800; display: flex; align-items: center; justify-content: center; } .list li .list_right .add input{ width: 0.85rem; border: none; height: 0.66rem; text-align: center; } .list li .list_right .add .plus{ width: 0.66rem; height: 0.66rem; background-color: #ed1755; border-radius: 0.04rem; font-size: 0.59rem; color: #fff; display: flex; align-items: center; justify-content: center; } .list li .list_right { flex: 1; padding-right: 0.33rem; } .list li .list_right .title{ font-size: 0.426rem; color: #333333; margin-bottom: 0.28rem; } .list li .list_right .numss{ display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 0.23rem; } .list li .list_right .sales{ font-size: 0.295rem; color: #999999; } .list li .list_right .numss .money{ font-size: 0.295rem; color: #333333; } .list li .list_right .money span{ font-size: 0.491rem; color: #ff5400; }