在SpringBoot项目中,一般我们将html文件放入templates文件夹中,

css,js,图片等静态资源放到static文件夹中

springboot引入思源字体 springboot css_springboot引入思源字体


当我们HTML,中引入css…样式时

springboot引入思源字体 springboot css_springboot引入思源字体_02


我们直接访问的就是static文件夹中的静态资源

而不是

../static/asserts/css/signin.css

这样看似很对,但是因为Springboot中的项目中有自动配置

*/**访问当前项目的任何资源(静态资源文件夹)
classpath:/META-INF/resources/
classpath:/resources/
classpath:/static/
classpath:/public/
/是项目的根路径(也就是resources)

所以这里如果写了…/static/asserts/css/signin.css反倒会失效,看似正确的导入实际上是错诶的


更新2020年11月13日20:35:07

又再一次遇到了css样式没有显示的异常,这次和上次的情况不同

这次是账号密码输入,如果输入错误的话就还呆在原来的页面,但是我这次遇到的是,输入错之后,页面改变了,css,js样式全都没有了,只剩下了html

最后找出了错误,是因为我在引用css时最前面没有加上/

在这里我的请求是

springboot引入思源字体 springboot css_html_03

在index前面还有个user,而我在之前请求的时候是localhost:8080/index或者localhost:8080,这样的话,他的url会发生改变,当我没有加/时,他会在更改过后的地址来寻找css样式,那肯定是找不到的,所以我们有两个选择,一是在css,js样式之前加上/,二是最好我们不修改原来的URL,还保持最开始的样子。

下面是我在百度上找到的一个例子:

路径最左边加 / 表示从根目录引用文件。

例如你的网站根目录是 E:\web

你的style在 E:\web\template\images\style.css

那么假如你有两个文件

E:\web\index.html

E:\web\news\index.html

如果两个文件都这样引用:< link href=“template/images/style.css” > 【没有“/”】那么

E:\web\index.html 将调用 E:\web\template\images\style.css

E:\web\news\index.html 将调用 E:\web\news\template\images\style.css 【不存在的CSS,出错】

如果两个文件都这样引用:< link href="/template/images/style.css" > 【有“/”】那么

E:\web\index.html 将调用 E:\web\template\images\style.css

E:\web\news\index.html 将调用 E:\web\template\images\style.css

这样不管你的html或者其他asp、jsp、php所在的文件在哪里,它都会从根目录去找这个文件

从而解决一些目录同步的问题。