Skip to content

CSS 未加载

快速摘要

你的 CSS 文件没被浏览器加载——可能是路径错、被 CSP 拦截,或 MIME 类型不对。

为什么发生

  • <link href> 路径错误,文件 404

  • 服务器返回的 Content-Type 不是 text/css,浏览器拒绝当作样式表

  • CSP 的 style-src 限制了该样式来源

  • 样式表在构建时被意外排除

最小示例

✗ 错误代码
<link rel="stylesheet" href="/style.css">
✓ 修复代码
<link rel="stylesheet" href="/assets/css/style.css">

实际文件在 /assets/css/style.css,路径写错就 404,页面无样式。修正路径即可。

如何诊断

  • 在 Network 面板查看该 CSS 文件的状态码和 Content-Type

  • 在 Elements 面板确认样式是否出现在 Styles 栏

  • 检查 link 标签的 href 路径

如何修复

  • 修正 href 路径,确保文件能被正确加载

  • 配置服务器返回正确的 Content-Type: text/css

  • 调整 CSP style-src,允许该样式来源

如何预防

  • 使用构建工具自动管理样式表路径

  • 部署时检查服务器 MIME 类型配置

相关资源

相关术语

相关课程

相关练习

← 返回语言