.products_list { padding: 0 20px 20px 20px; box-sizing: border-box; height: 100%; } .products_item { width: 100%; background-color: #fff; border-radius: 20px; padding: 10px; box-sizing: border-box; display: flex; // height: 160px; box-sizing: border-box; justify-content: space-between; &:nth-child(n + 2) { margin-top: 16px; } .item_img { width: 160px; height: 160px; position: relative; image { width: 100%; height: 100%; border-radius: 10px; } .num { padding: 5px 10px 5px 20px; font-size: $font_size_min; position: absolute; right: 0; bottom: 0; background: rgba($color: #000, $alpha: 0.3); border-radius: 36px 0px 20px 0px; color: #fff; text-align: center; } } .item_con { padding-left: 20px; font-size: $font_size; flex: 1; .title { font-size: $font_size; color: #707070; @include common_ellipsis(2); text { color: $color_font_one; font-weight: bold; } } .tag_list { display: flex; margin-top: 16px; flex-wrap: wrap; .tag, .tag_g { max-width: 260rpx; padding: 3px 10px; background-color: #cde5ff; font-size: $font_size_min; border-radius: 5px; color: $color_main; margin-right: 10px; margin-bottom: 10px; } .tag_g { background-color: #ffe6ce; color: #ee7500; } } .introduce { font-size: $font_size_medium; color: $color_font_two; @include common_ellipsis; } .des { font-size: $font_size_medium; color: #707070; margin-top: 16px; @include common_ellipsis($params: 2); } .header_label { width: 212px; height: 40px; background: #fcf4e9; border-radius: 5px; font-size: 24px; display: flex; text { display: inline-block; height: 100%; display: flex; justify-content: center; align-items: center; &:nth-child(1) { width: 80px; height: 40px; background: #fee5cd; border-radius: 5px 0px 0px 5px; color: #522b0fff; } &:nth-child(2) { flex: 1; background: #fcf4e9ff; border-radius: 0px 5px 5px 0px; color: #c57c26ff; } } } } }