在IntelliJ中如何引入CSS到HTML？引入后不生效如何排查

你单独打开HTML文件走的是本地file://协议，相对路径直接对应本地文件系统路径，而在IntelliJ中运行Web应用走的是HTTP服务协议，路径规则由Web服务的配置决定，常见失效原因如下：

• 静态资源映射配置错误
  大部分Web框架（Spring Boot、JavaWeb等）不会直接把项目根目录作为静态资源的服务目录，比如Spring Boot默认只会扫描resources/static、resources/public、resources/META-INF/resources下的静态文件，直接放在项目根目录的styles.css不会被服务识别，自然无法加载。
• 相对路径解析错误
  你当前用的相对路径href="styles.css"是相对于当前页面的访问URL的，比如你访问的页面地址是http://localhost:8080/user/index，那浏览器会自动拼接成http://localhost:8080/user/styles.css去请求，而不是你以为的服务根路径下的资源。可以把路径改成href="/styles.css"（前面加斜杠）强制从服务根路径查找资源。
• 资源未被正确部署
  检查IntelliJ的部署配置（Artifact配置），确认styles.css被包含到了最终的部署包中。你也可以直接在浏览器地址栏输入http://localhost:你的服务端口/styles.css访问，如果返回404就是资源没有被正确部署或者映射。
• HTML字符串拼接错误
  在运行的页面右键查看网页源代码，确认最终输出的link标签是<link rel="stylesheet" href="styles.css" />，没有出现转义符残留、引号不匹配的语法问题。

内容的提问来源于stack exchange，提问作者Tydal