这是世界线的第 3 站 · 前端，也是你第一次真正『看见』这个世界的时刻。 前两站都是图纸，这一站把图纸变成能在浏览器打开的实物。
这条提示词对小白最关键的，是那几条硬性约束——它们专治『AI 给的代码跑不起来』：
第一，死死咬住『单文件、无外部依赖』。这是为什么强调 html css 都内联、不准用 CDN：单文件你才能双击就打开、整段复制就嵌进别人网页，不用配环境、不会因为某个外链挂了就白屏。这正是你要的『可嵌入网页的产物』。
第二，强制 responsive（响应式）。不写这句，AI 经常只照顾电脑屏，手机上一塌糊涂。一句话就让它两端都管。
第三，首屏（first screen）优先、且用 CSS 模拟主视觉。小白没有素材图，AI 却爱写图片标签引用不存在的图——你一打开就是裂图。明确要求『用 CSS 渐变／形状模拟主视觉』，它就会纯代码画出气质，不依赖你没有的图片。
第四，喂图纸＋分段产出。把前两站的视觉规范和信息架构直接贴给它（这就是『给 AI 喂文档』），并要求『先只做首屏，确认了再往下』。这是 iterative dev 的思想——一次吐三千行代码你根本检查不过来，分段来才稳。
跟完这一站，你已经能双击打开看见你的世界了。但它还是『死』的——下一站【前端·交互】给它加上能点、能展开、能动的灵魂。
