.footer { width: 100%; position: fixed; height: 1rem; left: 0; bottom: 0; background: #fff; display: flex; align-items: center; justify-content: space-around; border-top: 0.02rem solid rgba(0,0,0,.1); box-sizing: border-box; } .footer li {} .footer li img { width: 0.42rem ; } .footer li p { font-size: 0.24rem; color: #8e8e93; } .header { position: fixed; width: 100%; left: 0; top: 0; height: 1.9rem; padding: 0.2rem 0.28rem 0.15rem; box-sizing: border-box; background: linear-gradient(90deg,#0af,#0085ff); } .header_location { height: 0.68rem; color: #fff; display: flex; align-items: center; } .header_location .icon-dingwei { font-size: 0.3rem; margin-right: 0.08rem; } .header_location .icon-xiangxia { font-size: 0.18rem; transform: scale(0.5); } .header_location span { font-size: 0.34rem; font-weight: bold; } .header_search { background: #fff; height: 0.72rem; margin-top: 0.12rem; display: flex; align-items: center; justify-content: center; } .header_search i{ font-size: 0.34rem; color: #999; } .header_search span{ font-size: 0.28rem; color: #999; margin-left: 0.08rem; } .content { margin-top: 1.9rem; margin-bottom: 1.2rem; } .class_list { display: flex; flex-wrap: wrap; padding-top: 0.2rem; } .class_list li{ width: 20%; text-align: center; margin-bottom: 0.2rem; } .class_list img{ width: 0.9rem; height: 0.9rem; margin-bottom: 0.1rem } .class_list p{ font-size: 0.24rem; color: #666; } .meal { display: flex; justify-content: space-between; background: linear-gradient(0deg,#f4f4f4 5%,#fafafa 95%); padding-left: 0.3rem; padding-top: 0.24rem; } .meal_left p:nth-child(1) { font-size: 0.34rem; color: #333; font-weight: bold; margin-bottom: 0.1rem; } .meal_left p:nth-child(2) { margin-bottom: 0.18rem; font-size: 0.26rem; color: #777; } .meal_left p:nth-child(3) { font-size: 0.24rem; color: #af8260; font-weight: 700; } .meal_left+img { width: 2.82rem; } .title { display: flex; justify-content: center; align-items: center; font-size: 0.3rem; margin: 0.2rem; } .title::before { content: ""; height: 0.02rem; background: #999; width: 0.4rem; margin-right: 0.2rem; } .title::after { content: ""; height: 0.02rem; background: #999; width: 0.4rem; margin-left: 0.2rem; } .shop_type { display: flex; justify-content: space-around; height: 0.8rem; align-items: center; } .shop_type li{} .shop_type i{ font-size: 0.14rem; color: #666; transform: scale(0.6); display: inline-block; } .shop_type span{ font-size: 0.28rem; color: #666; } .shop_list { margin-top: 0.4rem; } .shop_list .list_item { display: flex; margin-bottom: 0.4rem; } .shop_list li .shopimg{ width: 1.3rem; height: 1.3rem; } .shop_list li .list_r{ margin-left: 0.2rem; flex: 1; } .list_r_text .text_title { display: flex; justify-content: space-between; align-items: center; } .list_r_text .text_title .title_left{ width: 80%; display: flex; align-items: center; } .title_left span:nth-child(1) { background: linear-gradient(-139deg,#fff100,#ffe339); padding: 0.02rem 0.05rem; color: #6f3f15; font-size: 0.22rem; display: inline-block; width: 0.48rem; } .title_left span:nth-child(2) { font-size: 0.3rem; color: #333; font-weight: 700; width: 84%; display: inline-block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-left: 0.1rem; } .list_r_text .text_title .icon-xiangxia{ color: #777; transform: scale(0.5); } .text_zan {} .text_zan img{ width: 1.2rem; height: 0.2rem; } .text_zan span{ font-size: 0.22rem; color: #666; } .text_price { display: flex; justify-content: space-between; margin: 0.08rem 0; font-size: 0; } .text_price span:nth-child(2n)::before { color: #ddd; content: "|"; margin: 0 0.06rem; } .text_tags { display: flex; margin-top: 0.14rem; } .text_tags li { padding: 0 0.16rem; border: 0.02rem solid #ddd; box-sizing: border-box; font-size: 0.2rem; color: rgb(102, 102, 102); transform: scale(0.8); margin-left: -0.1rem; } .list_r_activity { justify-content: space-between; align-items: center; margin-top: 0.26rem; } .list_r_activity li{ display: flex; } .act_left { display: flex; width: 84%; } .act_left span{ background: rgb(240, 115, 115); color: #fff; font-size: 0.24rem; padding: 0.02rem 0.04rem; border-radius: 0.04rem; box-sizing: border-box; margin-right: 0.12rem; transform: scale(0.86); } .act_left p{ font-size: 0.24rem; color: #777; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transform: scale(0.9); margin-left: -0.2rem; } .act_right { display: flex; width: 20%; justify-content: flex-end; } .act_right span{ font-size: 0.22rem; color: #777; }