Sublime Text 本身不渲染 CSS，实时预览需依赖 Live Server 插件启动本地 HTTP 服务，确保 HTML 用相对路径引用 CSS、浏览器地址为 http:// 开头，并禁用缓存；file:// 协议因跨域和缓存限制无法生效。
Sublime Text 本身不运行、不渲染 CSS，所谓“实时查看效果”，本质是让浏览器快速加载你刚保存的样式文件，并自动刷新页面。最稳、最通用的路径只有一条：用 Live Server 插件起本地 HTTP 服务，配合正确路径引用和浏览器缓存控制。
为什么不能双击 HTML 文件或用 Open in Browser 插件？
因为它们走的是 file:// 协议，浏览器会禁用跨域请求、忽略相对路径解析、且缓存极难清除。常见现象包括：
- CSS 修改后页面样式没变（其实是缓存了旧文件）
-
<link rel="stylesheet" href="./css/style.css">报Failed to load resource - JS 动态插入的样式表根本不会触发重载
这些都不是 Sublime 的问题，而是 file:// 协议本身的限制 —— 它不支持服务器端逻辑，也没法发 Cache-Control 头。
Live Server 插件怎么配才真正生效？
装完 Live Server 后，关键不是“启动”，而是确保它监听的是你项目的真实结构：
立即学习“前端免费学习笔记（深入）”；
- 必须在 Sublime 中用
File → Open Folder打开整个项目根目录，而不是只打开单个.html文件 - 右键点击
index.html（或任意 HTML 文件），选Open with Live Server，不要 Ctrl+Click 链接 - 检查浏览器地址栏是否为
http://127.0.0.1:5500/或类似http://开头的地址，不是file:// -
<link>标签里的href必须用相对路径，比如href="style.css"或href="css/main.css"，不能写绝对路径或带file://
修改 CSS 后没刷新？先关掉浏览器缓存
即使用了 Live Server，Chrome/Edge 仍可能因“预测网络操作”或内存缓存跳过真实请求。最直接的解决方式：
- 打开浏览器 DevTools（F12），切换到
Network标签页，勾选Disable cache（仅在 DevTools 打开时生效） - 或者手动清空：按
Ctrl+Shift+R（硬刷新），比F5更可靠 - 如果用的是 JS 动态加载 CSS（比如
document.createElement('link')），Live Server刷新也无效 —— 这类场景得靠浏览器 Elements 面板实时编辑样式，或改用Browser Sync的 CSS 注入模式
想省事又不想装 Node.js？用 Live Server 就够了
Live Server 是纯 Python 实现，不用装 Node.js，不依赖命令行，也不需要配置构建系统。它唯一的要求就是你有一个能被浏览器正常访问的 HTML 入口文件，以及正确的相对路径引用。其他方案如 Browser Sync 或 LiveReload 虽然功能更强（比如支持多设备同步、CSS 注入），但引入了额外依赖和配置点，反而容易在路径、端口、插件启用状态上出错。对纯 CSS + HTML 静态开发来说，Live Server 是那个“改完保存，眼睛一抬就看到效果”的最小可行解。
