HTML 编辑器
VS Code 推荐插件、Live Server、Emmet 快捷输入
HTML 编辑器
写 HTML 不需要特殊软件——任何文本编辑器都可以。但推荐使用 VS Code，免费且功能强大。
学完本章你将： 掌握 VS Code 中写 HTML、推荐插件、实时预览。
VS Code 推荐插件
| 插件 | 功能 |
|---|---|
| **Live Server** | 保存自动刷新浏览器 |
| **Prettier** | 代码格式化 |
| **HTML CSS Support** | class/id 智能提示 |
| **Auto Rename Tag** | 自动同步修改闭合标签 |
Emmet 快捷输入
VS Code 内置 Emmet——输入缩写按 Tab 展开：
html
<!-- 输入: div.container>ul>li*3 然后按 Tab 展开为： -->
<div class="container">
<ul>
<li></li>
<li></li>
<li></li>
</ul>
</div>
<!-- 输入: p{段落文字} → <p>段落文字</p> -->
<!-- 输入: a[href="#"] → <a href="#"></a> -->Live Server 实时预览
- 安装 Live Server 插件
- 右键 HTML 文件 → "Open with Live Server"
- 浏览器自动打开，保存文件时自动刷新