在页面编辑中,有一些公共的页面部分(比如header,footer等)可以抽取出来放到模板中,其他页面使用的时候可以调取该模板,这样的好处是如果修改这些公共部分,只修改模板中的代码即可。

为了做到这一点,Thymeleaf需要我们定义包含可用的片段,我们可以通过使用:

  • th:fragment属性定义模板
  • th:include属性引入模板

例如:

1.创建一个template.html模板文件,加入如下代码:

<!--fotter-->
<div th:fragment="footer">
<div class="page-footer">
<div class="scroll-to-top">
<i class="icon-arrow-up"></i>
</div>
</div>
</div>

注意:要加入th标签引用,<html lang="en" xmlns:th="http://www.thymeleaf.org">

2.在其他页面中引用即可:

<div th:include="template :: footer"></div>

引用语法解释:th:include="templatename::domselector"

templatename是要引入页面的路劲加上去掉后缀的名称,例如footer.html页面建立在/WEB-INF/templates/footer.html,所以templatename为footer;domselector就是dom选择器,即为th:fragment中的值,或是选择id

注意:这里同样也需要引入th标签。

其他灵活运用方式,请参考:

thymeleaf中的模板布局

Thymeleaf添加页面模板的更多相关文章

  1. thymeleaf 添加语法提示

    thymeleaf 添加语法提示: xmlns:th="http://www.thymeleaf.org"

  2. springboot 1.5.2 thymeleaf 添加templates 静态资源访问路径

    从velocity 模板切换到thymeleaf 后, 默认模板位置为templates , 有时候静态资源方在该目录下会出现访问404错误 解决办法: application.properties ...

  3. 极简 Spring Boot 整合 Thymeleaf 页面模板

    虽然现在慢慢在流行前后端分离开发,但是据松哥所了解到的,还是有一些公司在做前后端不分的开发,而在前后端不分的开发中,我们就会需要后端页面模板(实际上,即使前后端分离,也会在一些场景下需要使用页面模板, ...

  4. Spring Boot2 系列教程(九)Spring Boot 整合 Thymeleaf

    虽然现在慢慢在流行前后端分离开发,但是据松哥所了解到的,还是有一些公司在做前后端不分的开发,而在前后端不分的开发中,我们就会需要后端页面模板(实际上,即使前后端分离,也会在一些场景下需要使用页面模板, ...

  5. SpringBoot框架 之 Thymeleaf

    目录 Thymeleaf 添加启动器 创建模板文件夹 基本使用 综合使用 Thymeleaf 介绍 SpringBoot并不推荐使用jsp Thymeleaf 是一个跟 Velocity.FreeMa ...

  6. springboot02 Thymeleaf

    一.http协议 1. 什么是协议? 协议是交易双方共同遵守的一种约定,比如: 租房协议 , 购买协议.... 2. 什么是http协议? HTTP协议是Hyper Text Transfer Pro ...

  7. 【SpringBoot】转载 springboot使用thymeleaf完成数据的页面展示

    版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明.本文链接:https://blog.csdn.net/weixin_36380516/artic ...

  8. springboot学习日志(二)-- thymeleaf学习

    本次学习如何使用thymeleaf以及相关语法1.在上一章写的那样 引入jar包到maven工程 <dependency> <groupId>org.springframewo ...

  9. 笔记43 Spring Security简介

    基于Spittr应用 一.Spring Security简介 Spring Security是为基于Spring的应用程序提供声明式安全保护的安全 性框架.Spring Security提供了完整的安 ...

随机推荐

  1. POSTGRESQL 9.1 FATAL: password authentication failed for user "postgres"

    1.配置postgreql 可以远程访问: sudo vim /etc/postgresql/9.1/main/postgresql.conf root@ubuntuserver:~# sudo vi ...

  2. 微信小程序,时间戳转为日期格式

    //数据转化 function formatNumber(n) { n = n.toString() ] ? n : ' + n } /** * 时间戳转化为年 月 日 时 分 秒 * number: ...

  3. datagrid多复选框

    <!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>Ch ...

  4. IntelliJ IDEA JDK配置

    1.JDK环境 目前大多数IDE都没有集成JDK环境,IDEA也是一样,在使用IDEA之前首先要安装JDK,并且配置环境变量.与其他IDE不同之处在于,IDEA不会自动匹配系统的JDK环境,编译时会提 ...

  5. Using Fast Weights to Attend to the Recent Past

    Ba, Jimmy, et al. "Using Fast Weights to Attend to the Recent Past." Advances In Neural In ...

  6. 第二百三十三节,Bootstrap表格和按钮

    Bootstrap表格和按钮 学习要点: 1.表格 2.按钮 本节课我们主要学习一下 Bootstrap 表格和按钮功能,通过内置的 CSS 定义,显示各 种丰富的效果. 一.表格 Bootstrap ...

  7. 总结 一下UML 类图的关系

    1,实线三角 表示 泛化  是一种继承关系,它指定了子类如何特化父类的所有特征和行为 2,虚线三角 表示 实现  是一种类与接口的关系,表示类是接口所有特征和行为的实现 3,空心菱形 表示 聚合 是整 ...

  8. 组合使用QT的资源管理高级功能简化开发过程

    使用 QT 进行团队开发的时候,常常碰到一个问题,就是如何共同管理资源?甚至一个人进行开发的时候如何简化资源的维护,避免无谓的消耗? 如果可以做到在开发的时候,大家把美工做的图片(往往是程序员先自己随 ...

  9. 总结OpenvSwitch的调试经验

    相信相信不少人在开始用OpenvSwitch(以下简称OVS)或者修改源码的时候,都不知道如何去调试,根据我的学习历程以及从网上搜集的资料做一个汇总. 一. 个人经验 从网上找相关资料,熟悉Openv ...

  10. [Algorithms] Longest Common Substring

    The Longest Common Substring (LCS) problem is as follows: Given two strings s and t, find the length ...