动手做：你的第一个个人介绍网页

01先准备好这三样东西

• 已经可以使用的 Codex 桌面任务。
• 一个确认过路径的空练习文件夹。
• 上一课写好的简介、兴趣和作品文字。

还没准备好时，先回到安装和工作区两课。下面这份示例使用虚构信息，可以直接练习。

02发送第一条制作需求

把需求发送到练习目录对应的任务中。如果出现权限提示，先读清它准备操作什么。

请在当前练习目录创建一个个人介绍网页。

昵称：Lin。
简介：一个喜欢记录生活、探索新工具的人。
兴趣：摄影、徒步、阅读。
作品：城市散步笔记——用文字记录街角的小发现。

用 HTML 和 CSS 实现，采用温暖浅色风格。
不要使用外部字体、图片或服务，不添加登录和付费功能。
请让我可以直接在浏览器打开 index.html 查看。
完成后告诉我文件位置，并检查小屏幕下是否有横向溢出。
只在本地制作，不发布。

预期产物是 index.html，也可能有单独的 CSS 文件。文件数量可以不同，页面能否打开以及内容是否符合要求更重要。

03打开并检查网页

1. 根据回复找到生成的文件。
2. 用浏览器打开 index.html。如果页面采用了需要本地服务的功能，请它说明原因与预览步骤。
3. 对照需求查看昵称、简介、兴趣和作品。
4. 缩小窗口，检查文字是否被遮挡，是否出现不必要的横向滚动。

看到“任务完成”的回复后，仍要亲自打开产物。本课提供练习方法，不承诺每次生成的页面完全一致。

04看看本次实际做出的网页

下面是 2026-10-02 按本课需求实际制作的示例。人物与作品正文均为虚构，图片是产物截图，不是 Codex 应用操作截图。

下载后解压，保持 index.html 和 style.css 在同一目录，再用浏览器打开 HTML。示例没有外部依赖。本次自动化浏览器只允许 HTTP/HTTPS 地址，未验证 file:// 直接打开；如遇显示问题，可使用本地预览服务。

05做一次具体的修改

不要一次只说“再好看一点”。挑一处最明显的问题，说明位置和期望。

请把首页昵称下方的简介字号稍微增大，并增加简介与兴趣列表之间的距离。保留其他内容和配色。修改后检查桌面和手机宽度下是否仍然易读。

保存修改后刷新浏览器，再对照变化。如果修改没有生效，先确认打开的是最新生成的文件，而不是另一个同名文件。

本次演示实际将桌面简介从 17px 增至 20px、手机简介从 16px 增至 18px，兴趣标签上方间距从 26px 增至 38px。其他页面内容保持不变。查看修改前后截图与验证记录 →