VS Code 多光标快捷键提升 HTML 编辑效率：①Ctrl+D 逐个选中相同文本；②Alt+拖拽实现列选择；③Ctrl+Alt+↓在多行同列追加光标；④Ctrl+Shift+L 将多行转为光标批量包裹标签。
Ctrl+D 选中相同 HTML 标签名或属性名
在 HTML 文件里快速批量修改标签或属性，Ctrl+D（Windows/Linux）或 Cmd+D（macOS）是最常用起点。光标停在某个标签名（如 div）、属性名（如 class）或值（如 "btn"）上，连按 Ctrl+D，VS Code 会逐个高亮并选中后续相同文本的匹配项。
注意：它只匹配「完全相同」的字符串，不区分标签上下文。比如选中 id，所有 id="xxx" 和单独出现的 id 字符都会被拉进来——容易误选 user_id 或注释里的 id。建议先用 Ctrl+F 确认范围，再手动按 Ctrl+K → Ctrl+D 跳过干扰项。
常见场景：
- 把一组
span全部改成em - 给多个
data-属性统一加前缀，如从data-id改成data-user-id - 批量删掉多处重复的
style="..."冗余内联样式
Alt+拖拽创建垂直列光标（HTML 属性对齐最实用）
写 HTML 时经常要给多行标签统一加/改属性，比如在每行末尾补 aria-hidden="true"，或对齐 class 值。这时用鼠标按住 Alt（Windows/Linux）或 Option（macOS），从第一行属性起始位置向下拖出一个矩形区域，松开后每行对应列都会出现一个光标。
立即学习“前端免费学习笔记（深入）”；
这个操作本质是「列选择」，不是字符级匹配，所以不受内容是否相同限制。但必须预判好起始列位置——如果某一行缩进不一致，光标会错位到空白或标签名中间，导致输入内容插在错误位置。
实操要点：
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
- 先用
Shift+Alt+F格式化 HTML，让结构对齐再操作 - 拖拽时尽量贴近等号左侧（如
class=的c上方），避免拖到引号内 - 若某行没有该属性，光标会落在行尾，可先手动补个空格再拖，保持列稳定
Ctrl+Alt+↓ 在相同位置追加多行光标（适合补闭合标签或换行）
当你要在连续几行的同一水平位置插入内容（比如每行末尾加 />、补 </li>、或者统一加换行和缩进），Ctrl+Alt+↓（Windows/Linux）或 Cmd+Option+↓（macOS）比拖拽更稳。
把光标放在第一行目标列（例如某 <ul> 行末），连按几次 Ctrl+Alt+↓，光标会逐行向下“复制”到相同 x 坐标位置。它不依赖内容是否匹配，也不受缩进差异影响，只要行存在就能落点。
但要注意：
- 如果中间有空行，光标会跳过——它只作用于「非空行」
- 若目标列超出某行长度，光标会落在该行末尾，可能破坏结构（比如把
</div>插到注释行末） - 按
Ctrl+U可一键取消全部多光标，别硬按 Esc
Ctrl+Shift+L 将整行转为光标（适合批量包裹 HTML 元素）
当你想给多行内容统一套一层标签（比如把几段文字全包进 <p></p>，或给列表项加 <li>），Ctrl+Shift+L 是最快路径。先用鼠标或 Shift+↑/↓ 选中多行，再按 Ctrl+Shift+L，每行开头立刻生成一个光标。
这时直接输入 <li>，所有行开头同步出现；再按 End 键跳到行尾，输入 </li>，就完成了包裹。比手敲或查找替换更可控，因为不会误触已有标签内部。
限制点很实际：
- 选中的行必须是「纯内容行」，不能包含已有 HTML 标签开头（否则光标会落在标签内，导致嵌套错乱）
- 如果某行是空行，
Ctrl+Shift+L不会为其生成光标——得先删空行或补占位符 - 输入完别忘了用
Shift+Alt+F重格式化，否则缩进可能歪掉
真正卡住人的往往不是快捷键记不住，而是光标落点没对齐、跳过了空行、或者格式化前就保存了——多光标是“所见即所得”，但 VS Code 不会替你检查 HTML 结构合法性。动手前花三秒看一眼缩进和行连续性，比事后调试快十倍。
