caimei365-www/src/main/resources/static/css/supplier/list.css

@charset "utf-8";
li{list-style:none}
/**
 * PC端
 */
@media screen and (min-width:768px){
    .loading{box-sizing:border-box;padding:200px 0;text-align:center;}
    .empty{box-sizing:border-box;padding:100px 0;text-align:center;color:#4A4F58;line-height:30px;font-size:16px;}
    .empty img{width:180px;height:180px;}
    .empty a{color:#E15616;}
    .supplierList{width:1184px;margin:16px auto;background:#FFF}
    .supplierItem{box-sizing:border-box;padding:16px;border-top:1px solid #F5F5F5}
    .supplierItem:first-child{border:none}
    .supplierItem .right{float:right;width:576px;position:relative}
    .supplierItem .left{float:left;width:560px;box-sizing:border-box;padding-left:152px;position:relative}
    .supplierItem .left .logo{position:absolute;left:0;top:0;width:136px;height:124px}
    .supplierItem .left .logo img{width:100%;max-height:100%}
    .supplierItem .left h5{line-height:32px;font-weight:bold;font-size:20px;}
    .supplierItem .left h5 span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;display:inline-block;vertical-align: middle;max-width:84%;}
    .supplierItem .left p{line-height:26px;font-size:14px;color:#93979F;white-space:nowrap}
    .supplierItem .left p>span{white-space:normal;height:auto;display:inline-block;vertical-align:top;max-width:82%}
    .supplierItem .left .tag{display:inline-block;height:20px;line-height:20px;font-style:normal;background:#86B2FB;color:#FFF;border-radius:2px;margin-right:10px;padding:0 5px}
    .supplierItem .products{position:relative;height:124px}
    .supplierItem .products li{float:left;width:100px;min-height:100px;background:url(/img/base/placeholder.png) no-repeat center center;background-size:80%;margin-right:16px}
    .supplierItem .products li img{width:100px;height:100px}
    .supplierItem .products li span{display:block;padding-top:8px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px;color:#93979F}
    .supplierItem .products a:hover span{color:#E15616;}
    .supplierItem .right .four{position:absolute;right:0;top:38px;line-height:24px;font-size:16px;color:#E15616}
    .supplierItem .right .four:hover{border-bottom:1px solid #E15616}

}

/**
* 移动端
*/
@media screen and (max-width:768px){
    .loading{box-sizing:border-box;padding:20vw 0;text-align:center}
    .empty{box-sizing:border-box;padding:15vw 0;text-align:center;color:#4A4F58;line-height:8vw;font-size:3.4vw}
    .empty img{width:40vw;height:40vw}
    .empty a{color:#E15616}
    .supplierItem{width:100vw;margin:2.8vw auto 0;box-sizing:border-box;padding:2.6vw 3.3vw;background:#FFF;overflow:hidden}
    .supplierItem .left{padding-left:13.6vw;position:relative}
    .supplierItem .left .logo{position:absolute;left:0;top:0;width:12.2vw;height:12.2vw}
    .supplierItem .left .logo img{width:100%;max-height:100%}
    .supplierItem .left h5{line-height:6vw;font-weight:bold;font-size:3.7vw;position:relative}
    .supplierItem .left h5 span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;display:inline-block;vertical-align:middle;max-width:84%}
    .supplierItem .left h5 a:after{content:'\276F';position:absolute;right:2vw;top:2vw;font-weight:normal}
    .supplierItem .left p{line-height:6vw;font-size:3.4vw;color:#93979F;white-space:nowrap}
    .supplierItem .left p>span{white-space:normal;height:auto;display:inline-block;vertical-align:top;max-width:82%}
    .supplierItem .left .tag{display:inline-block;height:4.4vw;line-height:4.4vw;font-size:2.6vw;font-style:normal;background:#86B2FB;color:#FFF;border-radius:2px;margin-right:2.2vw;padding:0 1vw}
    .supplierItem .products{position:relative;margin-top:2.6vw}
    .supplierItem .products li{width:29.4vw;min-height:29.4vw;background:url(/img/base/placeholder.png) no-repeat center center;background-size:80%;margin:0 1.3vw}
    .supplierItem .products li img{width:29.4vw;height:29.4vw}
    .supplierItem .products li span{display:block;line-height:4vw;padding-top:2.6vw;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:3vw;color:#93979F}

}