thymeleaf:在一个页面中引入其它的页面
这个在jsp中很容易实现,但是springBoot不推荐使用jsp,建议使用thymeleaf,下面是在thymeleaf中引入界面的方法
1.修改配置文件
spring:
mvc:
static-path-pattern: /static/**
thymeleaf:
prefix:
classpath: /templates/
在springBoot中,静态资源(如js,css,图片,静态html)都放在static当中,动态资源(如html)放在templates中。
这是我的目录结构

现在我要在index.html中引入main.html
2.修改main.html

用<div th:fragment="main"></div>把整个页面包裹起来,包裹的内容就是你要在index.html引入的部分
3.修改index.html,因为springBoot自动把static当作当前目录,所以要用../templates/shop/main而不是/templates/shop/main。
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div th:replace="../templates/shop/main :: main"></div>
</body>
</html>
thymeleaf:在一个页面中引入其它的页面的更多相关文章
- 同一页面中引入多个JS库产生的冲突解决方案(转)
发生JS库冲突的主要原因:与jQuery库一样,许多JS库都使用‘$’符号作为其代号.因此在一个页面中引入多个JS库,并且使用‘$’作为代号时,程序不能识别其代表哪个库(这个是我自己的解释,但更深的原 ...
- 页面中引入js的几种方法
通常大家最为熟悉的是一下两种方法: 在页面中直接写入<script type="text/javascript">js代码</script>. 在页面中引入 ...
- 页面中引入mui 地址选择,点击页面中其他input时页面回到顶部
问题:在页面中引入mui地址选择时,点击页面中的input页面会滚到顶部(谷歌浏览器中出现的bug),在手机上点击input会出现跳动.开始的时候是想修改mui.min.js里的滚动事件,但是后来找到 ...
- JSP页面中引入另一个JSP页面
一个JSP页面中引入另一个JSP页面,相当于把另一个JSP页面的内容复制到对应位置: <%@include file="date.jsp" %> 一般页面的top和bo ...
- 在UTF-8页面中引入编码为GBK的JavaScript文件乱码问题了
原文地址:http://js8.in/2009/12/11/%E5%AF%B9%E5%BC%95%E7%94%A8%E5%A4%96%E9%83%A8javascript%E9%A1%B5%E9%9D ...
- https http 混合访问_https 页面中引入 http 资源的解决方式
解决android 5.0 webview不能加载http与https混合内容的问题 在使用WebView加载https资源文件时,如果认证证书不被Android认可,那么会出现无法成功加载对应资源问 ...
- 在html页面中引入另一个html页面
我们在使用html编写一个网站的时候,通常情况下头部和尾部是相同的,如果一个网站的每个页面都把这些代码写一遍,不仅浪费时间,还显得重复代码很多,所以此时把重复的页面单独摘出来,在用到的时候从外部直接引 ...
- jsp页面中引入文件路径问题的解决方案(使用request获取项目路径)【原创】
在项目页面中,总会引入一些js和css,相对路径or绝对路径的选择就显得至关重要了!下面是项目中遇到的问题和解决方案,做一下记录! 环境: myEclipse创建工程,使用jsp+css+js,项目目 ...
- Java项目在jsp页面中引入jquery框架的步骤
环境:在Java web项目中引入juqery框架 工具:MyEclipse8.5 [步骤如下] A:新建一个Java web项目TestJquery,在WebRoot目录下创建一个jquery文件 ...
随机推荐
- [LOJ 6433][PKUSC 2018]最大前缀和
[LOJ 6433][PKUSC 2018]最大前缀和 题意 给定一个长度为 \(n\) 的序列, 求把这个序列随机打乱后的最大前缀和的期望乘以 \(n!\) 后对 \(998244353\) 取膜后 ...
- Serializable接口的意义和用法
本人软件工程大三妹子一枚,以下为个人观点仅供参考: 最近在云课堂学习springmvc+mybatis项目时,发现老师在实体类中引用了serializable这个接口,如下: import jav ...
- Ubuntu 安装git及git命令
1.检查git是否已经安装,输入git version命令即可,如果没有显示版本号表示没有安装git 2.安装git sudo apt-get install git 3.配置git全局环境git c ...
- 在Anaconda中使用linux的命令
在Anaconda中使用linux的命令 1.在anaconda中执行以下命令即可(要先activation 想用的环境): conda install m2-base 2.安装git.添加环境变量即 ...
- VS Code 提示‘未找到Git。请安装Git,或在“git.path”设置中配置’
一.情况说明 1.描述 从Git上克隆出代码,用vscode打开项目提示“未找到Git.请安装Git,或在“git.path”设置中配置” 2.截图 二.报错原因 .没有安装Git .没有设置Git路 ...
- vue中使用的一些问题(IE不兼容,打包样式不生效)
通过脚手架快速创建的项目,使用了swiper组件,项目中使用了es6语法,使用了babel-polyfill转化依旧不行,仔细排查项目中的使用组件,最后找到问题所在 swiper4.5.0版本太高,不 ...
- linux中查找包含指定内容的文件
Linux查找文件内容的常用方法 ##文件名+内容 grep -r "查询内容" 文件目录 ##只显示包含内容的文件名 grep -r -l "查询内容" 文件 ...
- mongodb实现文件存储系统
前言:这种坑很深呀,要对应mongodb的版本跟php支持的版本,然后,如果要用composer安装第三方的库,一定要一一对应的 正片开始! 开发环境: 系统:window 开发语言:php+apac ...
- Prometheus监控学习笔记之Prometheus如何热加载更新配置
0x00 概述 当 Prometheus 有配置文件修改,我们可以采用 Prometheus 提供的热更新方法实现在不停服务的情况下实现配置文件的重新加载. 0x01 热更新 热更新加载方法有两种: ...
- 2019-11-29-WPF-模拟触摸设备
原文:2019-11-29-WPF-模拟触摸设备 title author date CreateTime categories WPF 模拟触摸设备 lindexi 2019-11-29 08:47 ...