响应式行为
响应式设计是在不同宽度下保持同一页面的清晰含义，而不是互不关联的桌面和移动图片。
图解入门说明这些决策为什么对团队重要。
从准备好的根图层开始
标题为“从准备好的根图层开始”的章节每个根图层保持相同的页面和状态，只改变上下文宽度：
home [page=home] [bp=1440] [view=default]home [page=home] [bp=375] [view=default]选择团队真正会实现的宽度。截图宽度不会自动成为产品断点。
可以变化什么
标题为“可以变化什么”的章节可用空间变化时，可以改变：
- 尺寸和间距；
- 列数；
- 同一个有意义父级中的顺序；
- 可选内容的可见性；
- 已声明的展示方式，例如表格变为折叠列表。
页面含义、内容标识、动作和阅读顺序必须保持清晰。
不要为了网格改变数据
标题为“不要为了网格改变数据”的章节窄屏可以一次显示更少元素，但不能悄悄删除记录、改变价格或替换含义。分页、筛选或单独请求属于产品行为，应单独说明。
中间宽度也很重要
标题为“中间宽度也很重要”的章节检查两个示例宽度之间的其他宽度，而不只检查示例本身。文本、卡片、表格、固定控件和焦点指示器在这些宽度下也需要明确行为。优先使用按内容确定的尺寸和流式布局，而不是为每种设备复制页面。
声明真实的结构变化
标题为“声明真实的结构变化”的章节当结构发生变化时，说明来源、结果以及需要保留的内容：
- 记录和内容；
- 动作和字段关系；
- 选择和打开状态；
- 阅读顺序和焦点顺序。
按照交付契约，把对应关系记录到 responsive.transformations[]。table-mobile 这样的名称无法说明什么改变、什么保留。
方向和无障碍
标题为“方向和无障碍”的章节如果产品支持 RTL、本地化、缩放、减少动效或长文本，也要检查这些上下文。镜像布局不能破坏阅读顺序、键盘顺序、动作目标或可访问名称。
可以继续的条件
标题为“可以继续的条件”的章节当团队清楚什么保持不变、什么会变化、在什么条件下变化，以及哪些数据或动作被保留时，响应式部分就准备好了。结构化参考见变化轴。