这个在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：在一个页面中引入其它的页面的更多相关文章

  1. 同一页面中引入多个JS库产生的冲突解决方案(转)

    发生JS库冲突的主要原因:与jQuery库一样,许多JS库都使用‘$’符号作为其代号.因此在一个页面中引入多个JS库,并且使用‘$’作为代号时,程序不能识别其代表哪个库(这个是我自己的解释,但更深的原 ...

  2. 页面中引入js的几种方法

    通常大家最为熟悉的是一下两种方法: 在页面中直接写入<script type="text/javascript">js代码</script>. 在页面中引入 ...

  3. 页面中引入mui 地址选择，点击页面中其他input时页面回到顶部

    问题:在页面中引入mui地址选择时,点击页面中的input页面会滚到顶部(谷歌浏览器中出现的bug),在手机上点击input会出现跳动.开始的时候是想修改mui.min.js里的滚动事件,但是后来找到 ...

  4. JSP页面中引入另一个JSP页面

    一个JSP页面中引入另一个JSP页面,相当于把另一个JSP页面的内容复制到对应位置: <%@include file="date.jsp" %> 一般页面的top和bo ...

  5. 在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 ...

  6. https http 混合访问_https 页面中引入 http 资源的解决方式

    解决android 5.0 webview不能加载http与https混合内容的问题 在使用WebView加载https资源文件时,如果认证证书不被Android认可,那么会出现无法成功加载对应资源问 ...

  7. 在html页面中引入另一个html页面

    我们在使用html编写一个网站的时候,通常情况下头部和尾部是相同的,如果一个网站的每个页面都把这些代码写一遍,不仅浪费时间,还显得重复代码很多,所以此时把重复的页面单独摘出来,在用到的时候从外部直接引 ...

  8. jsp页面中引入文件路径问题的解决方案(使用request获取项目路径)【原创】

    在项目页面中,总会引入一些js和css,相对路径or绝对路径的选择就显得至关重要了!下面是项目中遇到的问题和解决方案,做一下记录! 环境: myEclipse创建工程,使用jsp+css+js,项目目 ...

  9. Java项目在jsp页面中引入jquery框架的步骤

    环境:在Java  web项目中引入juqery框架 工具:MyEclipse8.5 [步骤如下] A:新建一个Java web项目TestJquery,在WebRoot目录下创建一个jquery文件 ...

随机推荐

  1. Paper | Fast image processing with fully-convolutional networks

    目录 故事 方法 实验 发表在2017年ICCV. 核心任务:加速图像处理算子(accelerate image processing operators). 核心方法:将算子处理前.后的图像,训练一 ...

  2. IPv6 地址生命周期

    在preferred time和valid lifetime之间叫做deprecated 状态,当地址达到这个时间段的时候,地址不能主动的发起连接只能是被动的接受连接,过了valid lifetime ...

  3. 第02组 Beta冲刺（3/5）

    队名:無駄無駄 组长博客 作业博客 组员情况 张越洋 过去两天完成了哪些任务 数据库实践的报告 提交记录(全组共用) 接下来的计划 加快校园百科的进度 还剩下哪些任务 学习软工的理论课 学习代码评估. ...

  4. Unreal Engine 4 系列教程 Part 6：动画教程

    .katex { display: block; text-align: center; white-space: nowrap; } .katex-display > .katex > ...

  5. python创建文件时去掉非法字符

    1.函数作用 windows系统中文件名不能包含 \ / : * ? " < > |想要创建必须过滤掉这些字符 2.函数实现 import re def filename_fil ...

  6. Centos7安装percona-xtrabackup2.4和8.0版本

    Percona XtraBackup是一个基于MySQL的服务器的开源热备份实用程序 ,它不会在备份期间锁定您的数据库.无论是24x7高负载服务器还是低事务量环境,Percona XtraBackup ...

  7. IDEA快速修复错误快捷键

    有的时候在IDEA中编写代码,会出现错误提示,比如需要处理异常 将光标移动到出错,也就是划红线的地方,行首会出现一个小灯泡,点击会出现图二,可以按照提示进行修复

  8. Java JDK和IntelliJ IDEA 配置及安装

    序言 初学java,idea走一波先.安装完成,配置配置项. idea 软件 官方下载地址:https://www.jetbrains.com/idea/download/#section=windo ...

  9. [Zabbix] 安装MySQL5.7, 部署Zabbix到CentOS 7日记

    安装环境:CentOS7 64位,安装MySQL5.7 一.安装 MySQL 1.配置YUM源 在MySQL官网中下载YUM源rpm安装包:http://dev.mysql.com/downloads ...

  10. ASP.Net Core使用Ajax局部更新

    由于目前ASP.NET Core中没有提供Ajax帮助器,所以参照 上一篇帖文,使用data-ajax-*属性来使用jQuery Unobtrusive Ajax功能实现HTML的局部页面元素更新. ...