UI 组件 L3 · 部件与子结构 / Card Media
Card Media
承载图片、视频或图表的媒体区域
关键字段
Identity · 身份
- 子类型
- 插槽
- 父级类目
- Card、Image Viewer、Lightbox、Media Card、Product Card、Testimonial Card、Video Player
What · 是什么
- 定义
- 承载图片、视频或图表的媒体区域
- 组成与状态
- 语义容器、可见内容、交互入口、辅助说明和状态反馈（按组件取舍）。
Why · 为什么
- 作用
- 承载图片、视频或图表的媒体区域
Where · 在哪里
- 适用场景
- Web 界面设计
How · 怎么做
- 检查清单
- 命名清晰；与父组件语义关联；覆盖键盘和读屏；处理空、错误、加载和禁用状态；验证响应式行为。
Lifecycle · 生命周期
- 状态
- 启用
所属单一组件、复合组件或页面模式
关系来自本地关系表，并包含反向关联。
- Web 界面设计Web Interface Design应用于
围绕浏览器环境组织页面架构、导航、内容、区块、组件、转化和性能的界面设计领域。
- CardCard属于
将相关信息和操作组合成可扫描、可比较的内容容器。
- Image ViewerImage Viewer属于
支持缩放、旋转、平移和替代文本的图片查看器。
- LightboxLightbox属于
将图片、视频或媒体放大到聚焦上下文中并支持关闭和导航。
- Media CardMedia Card属于
结合图片、视频或音频预览、元信息和动作的内容卡片。
- Product CardProduct Card属于
呈现产品、价格、规格、库存和购买操作的商业卡片。
- Testimonial CardTestimonial Card属于
以头像、引用、姓名和身份呈现一条用户证言。
- Video PlayerVideo Player属于
组合播放控制、时间轴、字幕、音量和全屏能力的视频播放器。