springboot +Thymeleaf引入js css img--图片无效的解决办法

桃扇骨 2024-04-17 06:29 73阅读 0赞

今天在springboot上面集成了thymeleaf模板引擎，在引入css，js和img–图片的时候出现了好多问题，  
下面就让你们看下有效的解决方式吧

### 1：首先展示项目结构： ###

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4MjE1MDQy_size_16_color_FFFFFF_t_70]

### 2：其次是引入js ,css的格式 ###

<!DOCTYPE html>
    <html lang="en">
    <html xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <link th:href="@{/css/log.css}" href="../static/css/log.css" rel="stylesheet"/>
        <script th:src="@{/js/jquery.js}" src="../static/js/jquery.js"></script>
    </head>

上面的就是我引入js,css的格式，网上找了那么多，就这个能真正引进来！！！

### 3：还有就是img–图片的引入格式为 ###

<img th:src="@{/image/dynamic.gif}"/>

上面这种方法也可以直接引入图片  
温馨提示：SpringBoot没有配置静态文件的话，规范文件夹分类  
resource目录下，static放静态文件，templates放网页，这两个是spring默认的静态文件文件根目录和网页文件根目录  
可能这就是thymeleaf模板使用th:属性标签的时候不需要 …/static的原因吧！！！

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4MjE1MDQy_size_16_color_FFFFFF_t_70]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/c5e73effbe8a4e9596e1645e1b1173fe.png

发表评论取消回复

表情：

评论列表（有 0 条评论，73人围观）

还没有评论，来说两句吧...

相关阅读

相关 Nuxt全局引入JS、CSS，单个页面引入JS、CSS，nuxt引入外部JS、CSS

面以**wangEditor**编辑器为外部JS/CSS，作为演示的例子方法一、全局引入CSS ![在这里插入图片描述][watermark_typ...

刺骨的言语ヽ痛彻心扉/ 2024年04月17日 21:30/ 0 赞/ 98 阅读

相关 springboot +Thymeleaf引入js css img--图片无效的解决办法

天在springboot上面集成了thymeleaf模板引擎，在引入css，js和img–图片的时候出现了好多问题，下面就让你们看下有效的解决方式吧 1：首先展...

桃扇骨/ 2024年04月17日 06:29/ 0 赞/ 74 阅读

相关 springboot 引入js 和css 失效问题

今日在用springboot 整合模板thymeleaf时发现页面中无法加载js和相关css问题，这是引入文件路径也正常，可以touch到，路径如下： css引入路径如下

矫情吗；*/ 2024年02月18日 21:46/ 0 赞/ 31 阅读

相关 Springboot 集成Thymeleaf 引入js失效解决方法

文章目录一、问题描述二、解决办法一、问题描述今天在github上下载了一个项目，项目结构Springboot +

素颜马尾好姑娘i/ 2023年10月10日 11:23/ 0 赞/ 28 阅读

相关 thymeleaf引入公共css、js

有时候很多css文件是公共的，我们必须要在每个html文件中引入它们，其实我们可以利用Thymeleaf的模板布局，把这些css文件抽出来，同时如果有某个html文件专属的cs

向右看齐/ 2022年11月18日 10:54/ 0 赞/ 188 阅读

相关 Spring对css、img、js等静态文件拦截的解决办法

方法一：修改拦截方式将Spring的拦截方式有/\改为\.action或者是\.do 方法二：激活Tomcat的defaultServl

﹏ヽ暗。殇╰゛Y/ 2022年05月21日 06:47/ 0 赞/ 291 阅读

相关 thymeleaf 引入js css 无效

最近使用`thymeleaf` 引入 `js` 、`css` 总是无效。纠结了一会，然后找原因，发现了没有写 `type="text/css"` ；然后总结了一下，以防下次入坑

浅浅的花香味﹌/ 2022年05月17日 00:20/ 0 赞/ 296 阅读

相关引入jsp页面引入js失败的解决办法

zaijsp页面上的<head>标签中写了引入js的代码<script type="text/javascript" src="js/jquery-3.0.0.js"></sc

女爷i/ 2022年04月17日 01:53/ 0 赞/ 599 阅读

相关 springboot+thymeleaf解决css/js浏览器缓存问题

1、springboot配置application.yaml中加入 \启用内容版本策略 md5 spring.resources.chain.strategy.co

约定不等于承诺〃/ 2022年04月16日 03:17/ 0 赞/ 801 阅读

相关 Springboot中解决静态资源加载无效问题，例如img、css、js等

Springboot很大程度上简化了Spring web工程中的配置，但是还是需要一些基础配置。配置方式有两大类，一是通过java文件修改默认配置参数，二是直接在

骑猪看日落/ 2021年11月09日 20:54/ 0 赞/ 1168 阅读