@charset "utf-8"; //font $table:150px*0.5; $a :0.5; $z1 :10; $z2 :50; $z3 :100; body { // background : yellow; padding-bottom : $table; font-size : 1.5rem; height : 100%; .table { position : fixed; bottom : 0; left : 0; width : 100%; height : $table; margin : 0; background-color: #fff; padding-top : 15px; z-index : 10000; ul { width : 100%; height: 100%; a:nth-child(1) li { background-image: url(../static/img/ztb.png); } a:nth-child(2) li { background-image: url(../static/img/gc.png); } a:nth-child(3) li { background-image: url(../static/img/xm.png); } a:nth-child(4) li { background-image: url(../static/img/me.png); } a:nth-child(1) li.selected { background-image: url(../static/img/ztb1.png); } a:nth-child(2) li.selected { background-image: url(../static/img/gc1.png); } a:nth-child(3) li.selected { background-image: url(../static/img/xm1.png); } a:nth-child(4) li.selected { background-image: url(../static/img/me1.png); } li { width : 24%; height : 100%; display : inline-block; text-align : center; background-size: 30px !important; background : no-repeat center top; span { margin-top: 33px; display : inline-block; color : rgba(175, 175, 175, 1); } } li.selected { span { color: #ff5c5c; } } } } .search { width : 100%; height : 44px; padding : 7px 17px; background: #fff; input { width : 73%; height : $a*60px; background-color : rgba(240, 243, 245, 1); border-radius : $a*30px; border : none; background-image : url(../static/img/search.png); background-repeat : no-repeat; background-position: 15px center; background-size : 20px; padding-left : 40px; color : rgba(153, 153, 153, 1); outline : none; } span { font-size : 1.5rem; font-family: PingFang-SC-Medium; font-weight: 500; color : rgba(255, 92, 92, 1); margin-left: 13px; } } .bidlist { overflow-y : auto; padding-bottom : 75px; background-color: #f8f9fa; height : 90%; li { height : 302px*$a; margin-bottom : 18px*$a; background-color: #fff; padding : 35px*$a; h2 { height : 31px*$a; font-size : 32px*$a; font-family: PingFang-SC-Bold; font-weight: bold; color : rgba(32, 32, 32, 1); line-height: 31px*$a; } .p1 { margin : 20px*$a 0; font-size : 26px*$a; font-family: PingFang-SC-Medium; font-weight: 500; color : rgba(122, 122, 122, 1); } .time { float: right; } } } .label { background : rgba(242, 242, 250, 1); border-radius: 4px; font-size : 22px*$a; font-family : PingFang-SC-Regular; font-weight : 400; color : rgba(108, 116, 122, 1); padding : 5px; } .time { color: rgba(122, 122, 122, 1); } * { margin : 0; padding: 0; } } * { text-decoration: none; list-style : none; box-sizing : border-box; } table { table-layout: fixed; word-break : break-all; } $colour :#009688 #5FB878 #393D49 #1E9FFF #F7B824 #FF5722; // 支付弹窗 .payment { position : fixed; width : 100%; left : 0; top : 0; height : 100%; background-color : rgba(0, 0, 0, .5); background-position-x: 20px; background-size : 50%; div { height: auto; } >div { position : absolute; bottom : 0; left : 0; background-color: #fff; padding : 20px 0; width : 100%; max-height : 311px; >p { margin-bottom: 20px; font-size : 16px; font-family : PingFang-SC-Bold; font-weight : bold; color : rgba(32, 32, 32, 1); padding : 0 15px; } .auto { overflow-x: scroll; ul { padding : 15px; overflow-x: auto; width : 390px; border-top: .5px solid #afafaf; li { width : 107px; text-align : center; display : inline-block; margin-right: 10px; p { line-height : 58px; width : 100%; height : 64px; text-align : center; display : inline-block; background : rgba(255, 255, 255, 1); border : 2px solid rgba(255, 92, 86, 1); border-radius: 16px; color : red; span { font-size : 18px; font-family: PingFang-SC-Bold; font-weight: bold; i { font-size : 14px; font-style: normal; } } } >span { font-size : 22px*0.5; font-family: PingFang-SC-Medium; font-weight: 500; color : rgba(175, 175, 175, 1); } } .discount { p { line-height: normal; padding-top: 8px; } .del { display : block; font-size : 26px*0.5; font-family : PingFang-SC-Medium; font-weight : 500; text-decoration: line-through; color : rgba(204, 204, 204, 1); } } } } .confirm { border-top: .5px solid rgba(175, 175, 175, 1); ; padding: 15px 15px 0 15px; width : 100%; button { width : 90%; height : 40px; background : rgba(255, 92, 92, 1); border-radius: 8px; border : none; margin : auto; display : block; color : #fff; font-size : 16px; font-family : PingFang-SC-Medium; font-weight : 500; } p { font-size : 29px*0.5; font-family: PingFang-SC-Medium; font-weight: 500; color : rgba(175, 175, 175, 1); text-align : center; margin-top : 10px; span { color: red; } } } } }