跳到主要内容

商品卡片

不同类型的商品卡片。

CoDesign 设计稿

通用交互规则​

  • 悬停图片以中心等比放大 10%。
  • 成交额每三位数添加,作为分隔符。
  • 成交数大于四位数时候用w+代替，如 1,3000 转换为 1.3w+。
  • 当卡片内容缺少优惠信息时，卡片高度不变，优惠信息位置留空。

卡片型商品​

  • 商品标题最多两行，店铺名最多一行，，超出文本用...表示，悬停后Tooltip显示全部。

列表型商品​

  • 标题，产品介绍，店铺名最多一行超过文本框后，超出文本用...表示，悬停后Tooltip显示全部。
  • 当某一卡片内容缺少优惠信息时，卡片高度不变，优惠信息位置留空。
  • 价格、成交数每三位数添加,作为分隔符。
  • 成交数大于四位数时候用w+代替，如 1,3000 转换为 1.3w+。

MRO 型商品​

  • 标题，分类信息最多一行超过文本框后，超出文本用...表示，悬停后Tooltip显示全部。
  • 价格、成交数每三位数添加,作为分隔符。
  • 成交数大于四位数时候用w+代替，如 1,3000 转换为 1.3w+。

积分商品​

  • 标题最多一行超过文本框后，超出文本用...表示，悬停后Tooltip显示全部。
  • 积分、成交数每三位数添加,作为分隔符。
  • 成交数大于四位数时候用w+代替，如 1,3000 转换为 1.3w+。