课程
下载APP
源自:2-3 订单项组件

OrderItem style css

.orderItem{
   display: block;
   padding: 11px 10px 11px 15px;
}
.orderItem__picContainer{
   padding-right: 10px;
   display: inline-block;
}
.orderItem__pic{
   width:90px;
   height: 90px;
}
.orderItem__content{
   display: inline-block;
   width:calc(100% - 100px);
}
.orderItem__product{
   max-width:237px;
   font-size:17px;
   font-weight: 700;
   color:#111;
   padding-right:8px;
   box-sizing: border-box;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
}

.orderItem__shop{
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   font-size:13px;
   color:#777;
   padding-top: 9px;
   padding-bottom: 13px;

}
.orderItem__detail{
   display: flex;
   justify-content: space-between;
   height: 22px;
   line-height: 22px;
   padding-right: 4px;
}
.orderItem__price{
   font-size:13px;
   color:#777;
   vertical-align: 1px;
   margin-left: 10px;
}
.orderItem__price::before{
   content: "\A5";
   margin-right: 1px;
}
.orderItem__btn{
    width:80px;
    height: 22px;
    text-align: center;
    color: #fff;
    border:0;
    font-size:14px;
 }
.orderItem__btn--red{
   background-color:#e9203d;
}
.orderItem__btn--grey{
   background-color:#999;
}


提问者:bhappyu 2019-06-19 09:13

2个回答

  • weixin_慕容8367124
    2019-07-29 14:23

    很好!

  • radius_wzx
    2019-10-14 15:25

    GOOD JOB