项目：作品集——让作品替你说话
项目库第 2 个：三张作品卡片 + 关于我，做出一张能发给别人的作品集页面。跟做约 40 分钟。
项目库第 2 个项目。个人主页介绍「你是谁」，作品集展示「你做过什么」——找实习、接活、交作业，一张页面全说清。建议先做完个人主页再来。
成品长什么样
页面结构：名字 + 一句话定位 → 三张作品卡片（图标 / 标题 / 描述 / 标签）→ 「关于我」→ 页脚。参考成品在 examples/portfolio/reference.html。
第一步：复制这份需求说明
帮我做一个作品集页面，给想了解我作品的老师或合作方看。
页面从上到下包含：
1. 我的名字【换成你的】和一句话定位【如：我用 AI 做课堂小工具】；
2. 三张作品卡片，每张包含：作品图标（先用 emoji）、作品名、两句话描述、2 个标签；
我的作品是：【作品一】、【作品二】、【作品三】；
3. 一个「关于我」板块，两三句话；
4. 页脚一行版权。
布局要求：三张卡片在电脑上一行三张、手机上一行一张，自动换行。
风格：暖色背景、白色卡片、圆角、鼠标放上去卡片边框变色。
怎么算做好：双击打开，三张卡片完整可读，窗口拉窄时卡片自动变单列。操作步骤
- 建项目文件夹：
portfolio，独立于上一个项目。 - 发需求：把改好的整段发给 AI。
- 预览 + 填内容：双击打开后，逐张卡片换成你的真实作品。没有三个作品？用「我学会做的事」顶上，诚实描述学习过程也是作品。
- 做一次布局实验：让 AI「把三张卡片改成一行两张」，看效果；再改回三张。体会一下网格布局是怎么回事（想深究看布局）。
- 保存：确认所有文字都换成你的了，保存。
成功检查
- 双击能打开：名字、三张卡片、关于我、页脚都在
- 卡片内容是你自己的作品和描述
- 窗口拉窄到手机宽度，卡片自动变单列、不横向滚动
- 鼠标放到卡片上，边框有颜色变化
常见卡点
- 卡片挤成一行竖条：网格列宽没设对——用模板四把现象发回去：「三张卡片现在挤在一列，我期望电脑上一行三张」。
- 作品凑不齐三个：用学习中的项目，描述里写「进行中」比编造完成品诚实得多。
- 想放作品截图：把图片文件和 HTML 放同一文件夹，告诉 AI「每张卡片顶部加一张图片，文件名分别是 xx.png」。