响应式设计 · Responsive Design
英文：responsive design（按单词直读）
界面与交互难度：进阶 ★★
🗣️一句话大白话
同一个页面自动适配不同屏幕：桌面三列、平板两列、手机单列。不是「做个手机版网站」，而是同一套代码对宽度做出响应。不做响应式=一半用户被劝退。
🎬真实场景
你做的应用电脑上完美，老板用手机一开——横向滚动、按钮挤成一团。响应式断点（768px、375px）下重新排布，一套代码全端通用。
📮你可以这样说
「「全站响应式：桌面三列、平板两列、手机单列；导航手机端折叠；点击目标手机上不小于 44px；图片按容器缩放不溢出。」」
通过 AI绘图 工作台生成（模型 API 额度由此消耗）；未配置模型密钥时会提示失败原因。
⚠️边界与常见误解
- ▸手机优先设计通常效果更好：先满足最小屏，再往大扩
- ▸「响应式」要真机验证：浏览器缩窗口不算数
- ▸手机上没有悬停（hover）：别把关键功能放在悬停里
🕸️知识关系图
这个词条与相关术语、AI绘图 知识的连接关系