Thymeleaf站点无法读取CSS文件内容，加载后显示为空如何解决？

1. 缺失CSS静态资源的映射配置 #

你当前的GreatBookOfDietConfiguration中仅配置了/files/**路径的资源映射，没有覆盖CSS文件的存放路径，需要在addResourceHandlers方法中补充CSS路径的映射：

@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
    registry.addResourceHandler("/files/**").addResourceLocations("/WEB-INF/pdf/");
    // 补充css路径映射，适配你存放在/WEB-INF/css/目录下的样式文件
    registry.addResourceHandler("/css/**").addResourceLocations("/WEB-INF/css/");
}

2. Thymeleaf静态资源引用路径写法错误 #

不要使用../css/index.css这类相对路径写法，Thymeleaf的@{}语法直接使用项目内绝对路径即可，修改link标签为如下格式：

<link rel="stylesheet" th:href="@{/css/index.css}"/>

3. Thymeleaf命名空间拼写错误 #

你当前HTML代码中的Thymeleaf命名空间少写了字母f，拼写错误会导致所有th:开头的自定义属性不生效，替换为正确的命名空间即可：

<html xmlns:th="http://www.thymeleaf.org">

4. 可选排查：Maven资源过滤配置 #

如果修改上述配置后问题仍然存在，检查项目的pom.xml配置，确认没有排除webapp目录下的静态资源，确保CSS文件所在目录被正确打包到部署包中。

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