让Codex直接接手整个项目看起来很快，实际最容易丢掉范围、证据和回滚点。
只测试一个手机和一个桌面宽度，会漏掉最容易出错的断点附近。内容长度变化也可能让原本正常的布局突然遮挡。
所以这篇文章只解决一件事：用代表视口、临界宽度和长内容完成响应式回归测试。这套流程先控制一个小范围，确认有效后再扩大，避免把第一处错误复制到全部材料。
适合谁
适合网页在常见宽度正常，却在平板、缩放或临界断点出现导航错位的人。
不适合的情况也很明确：任务没有边界、原件无法恢复、关键事实无人负责，或最终结果准备直接对外发布。先解决这些前提。
Codex可以读取项目、修改文件和执行命令，因此先使用副本或版本控制，明确禁止触碰的目录与生产环境。高风险操作、唯一原件和最终判断必须留给人工。
开始前准备
- 目标页面集合
- CSS断点和常见设备宽度
- 最长标题、菜单和动态内容样本
- 建立一个测试副本或新目录，不直接操作唯一原件。
- 写下一句验收标准：断点前后、手机和桌面视口均无横向滚动、遮挡或不可操作元素，长内容不会撑坏布局
准备材料时，把“必须原样保留”“允许调整”“信息不足时禁止猜测”分开写。三类边界混在一句话里，执行时最容易被忽略。
完整步骤
第一步之前：先做一个最小样本
小样必须足够小，出现问题时能回到具体输入和步骤；也要足够真实，不能只用一个刻意简化、永远不会出错的示例。
第一步：从CSS找临界断点
除了常见视口，还测试断点前后各一个宽度，覆盖菜单切换和网格换列。
把“视口测试矩阵”作为本轮留存证据。后续合并或扩大范围时，都应能用它复盘。
第二步：自动检查几何问题
检测横向滚动、元素越界、重叠、不可见按钮和异常固定定位。
先停在这里检查一次。此时应已经形成“布局异常报告”，并且能回到原始材料说明它从哪里来。
第三步：用长内容和真实状态复测
打开菜单、搜索无结果、加载长标题和图片失败状态。
这一阶段的完成标志不是工具有回复，而是“状态化截图集”已经可供人工检查。
第四步：修复后跑相邻页面
共享组件修改后检查全部使用该组件的代表页面。
继续下一步之前，抽查“跨页面回归结果”中的边界项和异常项；发现前提不成立就先修正。
第五步：人工验收并沉淀流程
不要在第五步继续扩写内容，而是做对账：输入是否齐、步骤是否留证、结果是否可恢复、风险是否有人确认。
实际示例
导航在1180和1024像素都正常，却在1121像素换行遮住下一栏。把1121及断点两侧加入固定测试矩阵，才能防止问题回归。
可以先这样描述任务：
我正在处理“用代表视口、临界宽度和长内容完成响应式回归测试”。已有材料包括目标页面集合、CSS断点和常见设备宽度、最长标题、菜单和动态内容样本。请先不要扩大任务范围，也不要补造缺失信息。先完成“从CSS找临界断点”，输出可以人工检查的中间结果；我确认后，再继续“自动检查几何问题”。最终请按照“断点前后、手机和桌面视口均无横向滚动、遮挡或不可操作元素，长内容不会撑坏布局”列出验收结果和仍需人工确认的内容。
这个任务描述故意先要求中间结果，再允许继续。对高风险或范围较大的工作，可以在每一步都保留同样的确认点。
常见问题与报错
截图没有溢出，点击后页面才错位
把菜单展开、筛选、弹窗、加载更多和错误提示等交互状态纳入测试，静态首屏截图不足以覆盖布局。
任务跑了很久，却说不清改了什么
先要求列出计划和预计修改文件，每个阶段输出变更摘要、diff、命令和未解决项；没有检查点的长任务应暂停后重新拆分。
一次修改太多文件，出现问题无法定位
回到版本控制或副本，按一个目标一组文件重新执行；每批修改后立即运行对应检查，不把多个不相关需求放进同一次任务。
排查时先看实际读取文件、修改diff、命令和输出。一次只调整一个范围或规则，避免把多个故障叠在同一次执行里。
完成后的检查方法
- 断点前后、手机和桌面视口均无横向滚动、遮挡或不可操作元素，长内容不会撑坏布局
- 关键结论能回到原始材料、文件、命令输出或当前控制台。
- 没有把缺失信息、推测内容或示例数字写成已经确认的事实。
- 重要文件保留原件、版本或可恢复副本，敏感信息没有进入公开内容。
- 结果已经由真正负责这项工作的人审阅，而不是只看页面是否生成。
最后再问自己一次：这份结果解决了最开始的问题，还是只生成了另一份需要重新整理的材料？只有前者才算完成。
资料来源
- OpenAI Codex文档
用于核对Codex的产品定位和当前官方使用说明。
- OpenAI AGENTS.md指南
用于核对项目级规则文件的作用范围；具体行为以当前Codex版本为准。
FAQ
可以一次把整个任务交给Codex完成吗？
不建议一次交付全部范围。先按本文步骤完成一个小样，用“断点前后、手机和桌面视口均无横向滚动、遮挡或不可操作元素，长内容不会撑坏布局”验收，再决定是否扩大范围。
遇到“截图没有溢出，点击后页面才错位”应该先检查什么？
把菜单展开、筛选、弹窗、加载更多和错误提示等交互状态纳入测试，静态首屏截图不足以覆盖布局
完成后还需要人工检查吗？
需要。AI或执行工具负责推进流程，最终仍要由你根据原始材料、任务规则和“断点前后、手机和桌面视口均无横向滚动、遮挡或不可操作元素，长内容不会撑坏布局”完成验收。