用cursor可快速搭建作品集页面：创建index.html并自动补全html5结构，用emmet生成响应式作品卡片和导航栏，添加锚点实现跳转，右键开启实时预览，最后导出静态站点。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
用Cursor快速搭建一个能展示设计稿、代码片段和项目介绍的作品集页面，不需要配置Webpack或写一堆配置文件，直接在编辑器里边写边预览。
创建基础HTML结构
新建一个名为index.html的文件，顶部写上标准HTML5文档声明和基础骨架。
输入→回车→输入<code>→按Tab自动补全head/body结构。Cursor会提示你补全meta标签，选charset=utf-8和viewport这两项即可。
在内第一行敲main，按Tab触发Emmet缩写，生成<main></main>容器——这是作品集内容的主区域，后续所有模块都放在这里。
插入响应式作品卡片
把鼠标光标放在<main></main>内部，输入.card*3→按Tab，Cursor自动生成3个带class="card"的div块。
每个<div class="card">里依次填入：一张图片占位符（用<code>img[src="placeholder.jpg"][alt="项目截图"]→Tab）、一个h3标题（写项目名）、一段p描述（写技术栈和一句话亮点）。
注意：图片路径先用占位符，等实际上传资源后再替换；【alt属性必须写，否则无障碍访问会失败】。
添加导航栏与返回锚点
在开头、<main></main>上方插入导航栏代码：
Agents 正在你的整个代码库中处理越来越复杂、运行时间更长的任务。本次版本引入了新的 agent 框架改进，以实现更好的上下文管理，并在编辑器和 CLI 中带来了许多提升使用体验的修复。
输入nav>ul>li*4>a[href="#"]{项目}+{关于}+{博客}+{联系}→按Tab，Cursor展开为带链接的无序列表。
把第1个a的href改成#work，并在<main></main>开头加上id="work"——这样点击“项目”就能跳转到作品区。
这一步操作起来很简单，直接把文件拖进去就行。但若漏掉id匹配，点击导航不会滚动，得手动检查href和id是否完全一致（包括大小写和符号）。
启用实时预览并导出静态页
右键点击index.html文件 → 选择「Open Preview」，Cursor会在右侧弹出实时渲染窗口。
修改任意HTML或CSS时，预览窗自动刷新，不用手动F5。
确认效果满意后，在命令面板（Ctrl+Shift+P）输入「Export Static Site」→回车，选择输出目录，Cursor会生成含HTML、CSS、JS和资源文件的完整文件夹。
