一次真实演示：从需求到 Lin 的个人网页
保留初稿、一次示范修改、桌面与手机截图，以及可下载源文件。
读完这篇，你将能够
对照一份实际产物，理解生成、修改与验收的完整过程。
本篇目录
01这次演示的条件与范围
这次执行发生在 2026-10-02，由当前 Codex 会话完成，使用“第一个个人网页”教程中已写好的需求。它是一次有上下文的代理演示，不是独立新手试用，也不是隔离环境下的模型基准。
- 任务
- HTML/CSS 个人介绍页，人物为 Lin，包含简介、摄影/徒步/阅读、城市散步笔记。
- 限制
- 不使用外部字体、图片或服务，不加入登录和付费，只在本地制作。
- 运行条件
- 本地 macOS 工作区；Codex 内置浏览器；通过本机 HTTP 服务预览。应用版本、精确模型标识和用量未单独取证。
- 实际操作
- 一次初稿创建、一次预先设计的修改、浏览器验收和源文件打包；本次没有用户手工修改示例代码。
02第一次生成：内容先完整
初稿使用两个文件：index.html 和 style.css。山、太阳与小路由 CSS 图形构成，没有加载远程图片。作品正文可以通过原生折叠区域展开。
03一次修改：让简介更易读
按照教程预先写好的反馈，放大简介字号，并增加简介到兴趣标签的间距。这是教学演示中的修改，不是来自新手用户的真实可用性反馈。
桌面简介从 17px 增至 20px，手机简介从 16px 增至 18px；兴趣区域上方间距从 26px 增至 38px。HTML 文件保持完全相同，修改仅发生在 CSS。
04实际验证结果
| 检查项 | 观察结果 |
|---|---|
| 内容完整 | 昵称、简介、三个兴趣、作品均可见 |
| 1280px 桌面 | 页面宽度 1280px，无横向溢出 |
| 390px 手机 | 页面宽度 390px，无横向溢出 |
| 320px 窄屏 | 页面宽度 320px，无横向溢出 |
| 作品折叠 | 可展开与收起，正文可见 |
| 外部依赖 | 源文件未引用外部字体、图片、脚本或服务 |
| file:// 直接打开 | 未验证：自动化浏览器的地址策略不允许 |
| 公开部署 | 未执行 |
已验证的本地预览要求通过；由于直接文件打开尚未验证，不把全部原始要求标记为已通过。测试仅覆盖本次内置浏览器与列出的视口，不代表所有浏览器兼容性。
05时间记录怎样理解
本次记录窗口为北京时间 16:20:42—16:22:23，共 1 分 41 秒，从开始读取练习任务到完成修改检查和打包这一段为止。时间包含工具往返、浏览器检查和截图，不含后续教程编辑，也不是纯模型生成时长。
成本、Token 用量和独立新手完成时间均未获取。不据此推断其他模型的速度或用户通常需要多久。
06拿走示例，自己试一次
把昵称和简介替换成你的文字，再提出一条不同的修改需求。比较变化前后的结果，练习“明确变化范围，再检查是否做到”。
离开这一课之前
勾选状态仅保存在当前浏览器，不会上传或跨设备同步。
内容说明
本文记录本网站的实际制作过程，范围限于本地原型与验证。 更新日期：2026-10-02。