.header{/*在父元素上加margin左右超过父容器*/ font-size: 0; width: 100%; display: flex; align-items:center; justify-content:space-between; padding-top: 0.42rem; position: fixed; z-index: 999; top: 0; right: 0; left: 0; background: #f3f2f7; padding-bottom: 5px; } .left{ display: flex; align-items:center; padding-left: 0.24rem; } .left .left_1{ width: 0.2rem; height: 0.38rem; padding-right: 0.3rem; } .left .left_2{ width: 0.48rem; height: 0.48rem; } .middle{ display: flex; align-items:center; } .middle span{ font-size: 0.28rem; color: #000000; padding-right: 0.12rem; } .middle img{ width: 0.78rem; height: 0.32rem; } .right{ display: flex; align-items:center; } .right .right_1{ width: 0.42rem; height: 0.35rem; padding-right: 0.38rem; } .right_wz{ position: relative; } .right_wz span{ font-size: 0.2rem; color: #ffffff; width: 0.25rem; height: 0.25rem; background-color: #ea4e3d; border-radius: 100%; position: absolute; text-align: center; line-height: 0.25rem; top: -0.14rem; right: 0.24rem; } .right .right_2{ width: 0.37rem; height: 0.36rem; padding-right: 0.25rem; } /*中间*/ .content{ background: #f3f2f7;/*背景色*/ margin-top: 0.9rem; font-size: 0; margin-left: 0.24rem; margin-right: 0.24rem; } /*顶部文字布局*/ .content_top{ margin-top: 1.1rem;/*数值过大*/ background: url(../img/bj.png); width: 7.02rem; height: 1.8rem; } .content_wz{ width: 100%; height: 100%; display: flex; align-items: center; justify-content:space-between; } .content_wz li{ text-align: center; padding-left: 0.37rem; padding-right: 0.37rem; } .content_wz_1{ font-size: 0.34rem; color: #ffffff; } .content_wz_2{ font-size: 0.24rem; color: #ffffff; } /*直播*/ .live{ width: 7.02rem; height: 0.78rem; background-color: #ffffff; border-radius: 0.2rem; margin-top: 0.24rem; display: flex; align-items: center; justify-content: space-between; padding-left: 0.19rem; padding-right: 0.17rem; box-sizing: border-box; } .live_left{ display: flex; align-items: center; } .live_left img{ width: 0.41rem; height: 0.39rem; padding-right: 0.09rem; } .live_left span{ font-size: 0.32rem; color: #1a1a1a; } .live_right{ display: flex; align-items: center; } .live_right img{ width: 0.12rem; height: 0.21rem; } .live_right span{ font-size: 0.28rem; color: #0079f1; padding-right: 0.11rem; } /*店铺部分*/ .shop{/*我h2没有话div,没有设置居中挤下去的*/ width: 7.02rem; height: 2.75rem; background-color: #ffffff; border-radius: 0.2rem; margin-top: 0.24rem; } .shop h2{ font-size: 0.3rem; color: #010101; padding-top: 0.34rem; padding-left: 0.34rem; } .shop_1{ display: flex; align-items: center; padding-top: 0.37rem; justify-content: space-between; padding-left: 0.5rem; padding-right: 0.5rem; } .shop_1 li{ text-align: center; } .shop_1 li img{/*图片尺寸问题*/ width: 0.57rem; height: 0.43rem; margin-bottom: 0.3rem; } .shop_1 .yyzh{ width: 0.58rem; height: 0.56rem; margin-bottom: 0.15rem; } .shop_1 .mz{ font-size: 0.24rem; color: #333333; } .shop_1 .yzz{ font-size: 0.22rem; color: #abb1bc; } .shop_1 .wzz{ color: #e93323; font-size: 0.22rem; } /*管理部分*/ .manage{ width: 7.02rem; background-color: #ffffff; border-radius: 0.2rem; margin-top: 0.23rem; } .manage h2{ font-size: 0.3rem; color: #010101; padding-top: 0.36rem; padding-left: 0.34rem; } .layout{ display: flex; margin-top: 0.54rem; flex-wrap:wrap } .layout li{ text-align: center; padding-left: 0.34rem; padding-bottom: 0.31rem; width: 0.96rem;/*设置宽度不知道对不对*/ } .layout li p{ font-size: 0.24rem; color: #333333; margin-top: 0.36rem; } /*店铺营销*/ .market{ width: 7.02rem; background-color: #ffffff; border-radius: 0.2rem; margin-top: 0.24rem; } .market h2{ padding-left: 0.34rem; padding-top: 0.34rem; font-size: 0.3rem; color: #010101; }