返回辨真假
辨真假
文字提示 vs 气泡卡片 vs 悬停卡片
Tooltip · Popover · Hover Card
一句解释、一个小面板、一张悬停信息卡
LIVE DEMO全量并排,直接切身感受差异
什么时候用哪个按成员拆开看场景,不再靠猜
文字提示
Tooltip
- 只补一句说明,不承载操作
- 目标是解释图标、缩写或按钮含义
- 用户移开指针后内容就可以消失
气泡卡片
Popover
- 除了说明,还要放按钮、表单或更多内容
- 内容需要点击触发并保持打开一会儿
- 适合快捷操作、筛选器、小设置面板
悬停卡片
Hover Card
- 主要是补充预览信息,而不是执行操作
- 用户悬停时想先看摘要、作者卡、简介卡
- 内容比 tooltip 丰富,但仍偏浏览而非编辑
各自的提示词当前按 Web 组织,复制即可继续指挥 AI
文字提示
Tooltip
给工具栏图标加文字提示(Tooltip):悬停「保存」图标显示「保存 (Cmd+S)」,延迟 300ms 出现
气泡卡片
Popover
点「筛选」按钮弹出气泡卡片(Popover):内含日期选择和状态复选框,点卡片外自动关闭
悬停卡片
Hover Card
在用户头像上加悬停卡片(HoverCard):悬停 300ms 浮出名片卡,显示头像、昵称和「关注」按钮,移开后收起