媒体填充方式

预期结果：定义或使用 媒体填充方式 (object-fit)，做出清楚、一致又好用的视觉体验。 用户场景：市集把卖家照片放进 4:3 的盒子，并使用 `object-fit: cover`。搭配为 `object-position` 保存的焦点，就不会把人脸裁到眼睛。产品示意图则改用 `contain`，以留白保留所有标注。 要运用的设计概念：媒体填充方式 (object-fit)。 适用理由：可以按设计裁剪时使用 `cover`；每一部分都必须看见时使用 `contain`。也要测试很宽和很高的媒体。 不应使用的情况：图表、截图、二维码或文档不要使用 `cover`，因为裁剪可能移除重要信息。 设计要求：定义内容先后顺序、可复用的设计变量（Token）与组件。说明页面如何随屏幕大小和状态改变。分清必要的设计方向与纯装饰。 包容性与韧性：检查对比度、缩放、多语言、主题切换与减少动态效果。不能只靠颜色或特效表达含义。 验收标准：在手机、桌面、缩放、各种主题与所有支持语言中仍清晰可读。每个交互状态都一致且容易理解。 证据与限制（证据边界）：正式文档仍可能是草案、候选版或最终版。请查看文档状态，也要确认浏览器或平台是否支持。 待确认：品牌限制、内容多少、支持的主题与语言、目标设备，以及现有设计系统规则。