Sublime Text 无内置HTML/CSS调试器，需依赖浏览器DevTools定位错误；可通过Live Server插件实现保存即刷新，配合Emmet、代码格式化等辅助提升效率。
Sublime 里没有内置 HTML/CSS 调试器
Sublime Text 本身不提供类似浏览器的 DOM 检查、样式实时编辑或断点调试能力。它只是个文本编辑器，html 和 css 文件保存后，必须靠外部工具（主要是浏览器）来查看效果和排查问题。
所谓“调试”，在 Sublime 场景下实际是「快速预览 + 快速定位错误」。重点不是让 Sublime 做浏览器的事，而是让它更顺滑地把文件推给浏览器、并帮你发现写错的地方。
用 Live Server 插件实现保存即刷新
这是最接近“实时预览”的方案，本质是启动一个本地 HTTP 服务，自动监听文件变化并刷新页面。比直接双击打开 file:// 协议更可靠，尤其对 AJAX、相对路径、CORS 等场景。
- 安装插件：
Package Control → Install Package → Live Server - 打开任意
index.html，右键选择Open with Live Server，会自动在默认浏览器中打开http://127.0.0.1:5500/ - 修改并保存
.html或关联的.css文件，页面自动刷新（无需手动 F5） - 注意：不要在 Sublime 中用
Ctrl+Click打开file://链接——这会绕过 Live Server，导致样式不生效或脚本报错
HTML/CSS 错误基本靠浏览器 DevTools 定位
Sublime 不校验语法，也不提示标签闭合错误或 CSS 属性拼写错误。这些必须依赖浏览器控制台和元素面板。
立即学习“前端免费学习笔记（深入）”；
- 打开页面后按
F12，切换到Console标签页：看是否有Uncaught SyntaxError、Failed to load resource这类报错 - 切换到
Elements标签页：检查 HTML 结构是否如预期；点击元素右侧Styles面板，确认 CSS 是否被加载、是否被覆盖、是否有invalid property name提示（比如把backgound-color写错了） - 常见坑：
link标签的href路径写错、CSS 文件编码不是UTF-8 without BOM、HTML 中用了未声明的自定义标签但没配 Web Components
Sublime 自身能做的有限辅助
它没法替代浏览器，但可以减少低级错误、加快反馈循环。
- 装
Emmet插件：输入ul>li*3按Tab快速生成结构，降低手误概率 - 启用
HTML-CSS-JS Prettify：格式化代码后更容易看出缩进错乱或标签嵌套异常 - 开启
Highlight Matching Tag（设置里搜）：光标停在<div> 上时，对应闭合标签会被高亮，避免漏写 <code>
