返回辨真假
辨真假

列表 vs 表格 vs 卡片

List · Table · Card

一句话区分

顺着扫、按列比、像模块墙一样看

LIVE DEMO全量并排,直接切身感受差异

列表

List

查看词条

表格

Table

查看词条
名称状态金额
设计稿交付成功¥3,200
接口联调待处理¥1,800
文案审校成功¥640

卡片

Card

查看词条

周末徒步路线

精选三条城市周边轻徒步路线,适合新手,全程约两小时。

什么时候用哪个按成员拆开看场景,不再靠猜

列表

List

  • 用户主要是顺着往下扫内容
  • 每一项结构相近,但不强调列对列比较
  • 适合消息流、任务列表、文章列表

表格

Table

  • 需要按列比较多条数据
  • 字段明确,排序、筛选、批量操作很重要
  • 适合订单、报表、后台数据管理

卡片

Card

  • 每个对象更像一个独立模块
  • 信息块里有图片、状态、按钮等组合内容
  • 适合商品、作品、人员、项目展示墙
各自的提示词当前按 Web 组织,复制即可继续指挥 AI

列表

List

Web

做一个消息列表(List):每行左侧头像(Avatar)、中间昵称和摘要,点击整行进入详情页

表格

Table

Web

做一个订单表格(DataTable):列「订单号、金额、状态」,支持点表头排序,底部加分页(Pagination)

卡片

Card

Web

做一个商品卡片(Card):顶部封面图,中间标题和 ¥99 价格,底部「加入购物车」按钮(Button)

列表 vs 表格 vs 卡片 对比 · ViboDesign