在页面编辑中，有一些公共的页面部分（比如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. sitemesh 学习之 meta 引入

    在上篇笔记学习了sitemesh的基本用法,这里还有另一种用法 在sitemesh.jar有一个默认的sitemesh-default文件 ,这个文件是可以指定的 可以指定的文件名的sitemesh. ...

  2. binutils工具集之---objdump

    在嵌入式软件开发中,有时需要知道所生成的程序文件中的段信息以分析问题,或者需要查看c语言对应的汇编代码,此时,objdump工具就可以帮大忙了.obj——object  dump:转储. #inclu ...

  3. C运行库和VC对应关系

    ## C运行库和VC对应关系----------------------------------------------------------------Msvcr60.DLL -- VC6Msvc ...

  4. STM32F10x_RTC日历

    Ⅰ.概述 接着上一篇文章来讲述关于RTC的计数功能,我们以实例RTC日历(读写年.月.日.星期.时.分.秒)来讲述该章节. STM32F1系列芯片的RTC功能和其他系列(F0.F2.F4等)相比来说, ...

  5. easyui -grid每列绑定tooltip

    /**用法:*/function doCellTip() { $('#dg').datagrid('doCellTip', { 'max-width': '100px' });} /** * 扩展两个 ...

  6. 第二百零七节，jQuery EasyUI，MenuButton(菜单按钮)组件

    jQuery EasyUI,MenuButton(菜单按钮)组件 学习要点: 1.加载方式 2.属性列表 3.方法列表 本节课重点了解 EasyUI 中 MenuButton(菜单按钮)组件的使用方法 ...

  7. 【BZOJ】3397: [Usaco2009 Feb]Surround the Islands 环岛篱笆（tarjan）

    http://www.lydsy.com/JudgeOnline/problem.php?id=3397 显然先tarjan缩点,然后从枚举每一个scc,然后向其它岛屿连费用最小的边,然后算最小的即可 ...

  8. 首次接触XAMPP，端口被占用困恼

    本人运气比较好,首次安装XAMPP就碰到了各种问题啊!并且已经解决,以下是我问题的出处并且解决. 问题描述: apache无法打开,并且连带的出现了mySql无法打开.(即80端口冲突问题) 解决办法 ...

  9. Visual Studio 2015 自定义文件编译

    自己编译好了 QT 5.6.0 Alpha 版本后,如何使用 VS2015 创建 QT 工程呢? 1.安装插件,安装失败!因为 VS2015 不再支持 ADDIN , 所以 QT-VS-ADDIN 只 ...

  10. jacob操作 office 内部对应代码

    Excel操作  转换 xlAddIn                                 18 Microsoft Office Excel 加载项 xlAddIn8           ...