VS Code中HTML关联CSS需手动写标准标签，路径须相对准确且含rel="stylesheet"；路径错误可Ctrl+点击验证；样式不生效多因浏览器缓存、CSS语法错误或未启用本地服务器。
VS Code 里给 HTML5 文件关联 CSS，本质就是写对 标签，不是靠编辑器“绑定”——VS Code 不会自动帮你加引用，也不会读取文件名做隐式关联。
HTML 中怎么写
必须手动在 里写标准引用，路径要相对准确。常见错误是路径写成绝对路径（比如 C:\project\style.css）或漏掉 rel="stylesheet"。
-
href值是相对于当前 HTML 文件的路径，不是相对于项目根目录或 VS Code 工作区 - 推荐用相对路径：如果
index.html和style.css在同一级，就写href="style.css" - 如果 CSS 在
css/style.css，HTML 在根目录，就写href="css/style.css" - 务必包含
rel="stylesheet"，否则浏览器不识别为样式表 - 可加
type="text/css"，但 HTML5 中已非必需
示例：
My Page
VS Code 里路径补全和路径错误怎么查
VS Code 本身不校验 href 是否真实存在，但它能高亮路径（按住 Ctrl 点击可跳转），前提是路径语法合法、且文件确实存在。
立即学习“前端免费学习笔记（深入）”；
- 如果 Ctrl + 点击
href没反应，大概率是路径写错了，或文件还没保存/没创建 - 路径中大小写敏感（尤其部署到 Linux 服务器后），
Style.css≠style.css - 不要用中文路径或空格，容易引发编码或解析问题
- 用 VS Code 的「资源管理器」确认文件层级关系，比凭记忆写更可靠
为什么改了 CSS 页面没变？常见干扰项
不是 VS Code 的问题，而是浏览器缓存或加载时机问题。HTML 引用了 CSS，不代表样式立刻生效。
- 浏览器可能缓存旧 CSS，强制刷新（Ctrl+F5 或 Cmd+Shift+R）比普通 F5 更彻底
- CSS 文件有语法错误（比如漏了
}），会导致后续规则失效，用浏览器开发者工具的「Console」和「Elements → Styles」面板查 - CSS 选择器优先级被覆盖，检查是否被其他样式（包括浏览器默认样式）压制
- HTML 文件没保存，或者保存到了错误位置（比如改了
css/style.css，但 HTML 引用的是styles.css）
最常被忽略的一点：VS Code 只是编辑器，它不运行服务器。直接双击打开 HTML 文件时，部分 CSS 功能（如 @import 跨域、某些本地字体加载）会因浏览器安全策略失败——开发阶段建议用 Live Server 插件起一个本地服务，而不是依赖 file:// 协议打开。
