Layout方言是Thymeleaf方言，允许用户创建布局和模板以重用HTML代码。 它具有分层方法，并使用装饰模板来“装饰”布局文件。 布局方言是一个独立的项目，Thymeleaf不附带。 但是，它是GitHub上可用的开放源代码，它有充分的文档记录，并且似乎维护得很好。
安装方式
我们需要将Thymeleaf入门包添加到您的Spring Boot pom：
<dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency>
但是，从Spring Boot 2开始，这已经不够了。 Pom方言不是Spring Boot的一部分，我们必须自己添加它：
<dependency> <groupId>nz.net.ultraq.thymeleaf</groupId> <artifactId>thymeleaf-layout-dialect</artifactId> <version>2.3.0</version> </dependency>
该代码示例还使用Bootstrap，因此您还需要添加Web文件：
<dependency> <groupId>org.webjars</groupId> <artifactId>bootstrap</artifactId> <version>4.0.0</version> </dependency>
最后一步，我们需要在带注释的@Configuration类中创建一个LayoutDialect bean。
@Bean public LayoutDialect layoutDialect() { return new LayoutDialect(); }
让我们走得更远。
布局方言示例
本示例将说明如何使用布局方言来定义页面的布局，以便更好地重用代码：使用index.html页面，该页面使用layout.html作为布局。 名称Layout.html是任意的，可以是任何东西。 此处添加了一些其他文件，但它们仅用于演示。
该图显示了资源文件夹的结构。 Spring Boot将在resources / templates目录中自动找到所有Thymeleaf模板。
Layout.html
<!DOCTYPE html> <html> <head> <title layout:title-pattern="$LAYOUT_TITLE - $CONTENT_TITLE">Igorski.co</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> <link th:href="@{/webjars/bootstrap/4.0.0/css/bootstrap.min.css}" rel="stylesheet" media="screen" /> </head> <body> <div th:replace="fragments/header :: header"> This header content is going to be replaced.</div> <div class="container"> <div class="row"> <div class="col-2" layout:fragment="sidebar"> <h1>This is the layout's sidebar</h1> <p>This content will be replaced if the page using the layout also defines a layout:fragment="sidebar" segment.</p> </div> <div class="col" layout:fragment="content"> <h1>This is the Layout's main section</h1> <p>This content will be replaced if the page using the layout also defines a layout:fragment="content" segment. </p> </div> </div> </div> <footer th:insert="fragments/footer :: footer" class="footer"> This content will remain, but other content will be inserted after it. </footer> </body> </html>
Layout.html使用布局方言提供
的五个处理器中的两个 。 第一个是布局：
标头模板处理器 。 标题模板处理器可帮助用户确定结果页面的最佳标题。 在此示例中，它将最终标题定义为页面标题和布局标题的组合。 为此，使用了两个特殊标记，它们在布局方言中显示：
$ LAYOUT_TITLE和
$ CONTENT_TITLE 。
layout.html中最重要的是布局定义的两个占位符（或片段）：
fragmentprocessor 。 该处理器使我们能够在布局中定义内容占位符。 这些占位符的内容以后将被使用布局的页面内容替换。 该示例定义了两个不同的片段，一个用于侧边栏，一个用于主要内容。 但是，只要它们都具有不同的名称，我们就可以拥有任意数量的片段。
Index.html
<!DOCTYPE html> <html xmlns:layout="http://www.w3.org/1999/xhtml" layout:decorate="~{layouts/layout}"> <head> <title>Home Page</title> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <link th:href="@{/css/core.css}" rel="stylesheet" media="screen" /> </head> <body> <div class="container"> <div class="row"> <div class="col-2" layout:fragment="sidebar"> <h1>Sidebar</h1> <a href="#">Login</a> </div> <div class="col" layout:fragment="content"> <h1>Welcome to the Index page</h1> <br>This content is replacing the content of the layout:fragment="content"<br> placeholder in layout.html</p> </div> </div> </div> </body> </html>
我们声明index.html使用layout.html作为其布局，并使用以下布局：装饰处理器。 完成此操作后，我们声明index.html将使用layout.html模板。 这里最重要的是使用
片段处理器 。 它指示将要使用的内容，而不是具有相同名称的布局片段的内容。 另一件事值得一提。 在生成的index.html页面上，经过处理后，我们将获得标题，它是两个标题的组合，一个来自index.html，另一个来自布局。 他们将被合并。
无需任何处理即可在浏览器中查看layout.html和index.html。 但是经过处理后，我们发现index.html完全不同。 index.html的内容用于对布局进行样式设置，并根据布局定义将内容放置在布局内。
该示例中还有两个其他元素：页眉和页脚。 但是，他们使用Thymeleaf标准布局th：替换和th：插入处理器。 与
布局方言中介绍的五个处理器中的
最后两个非常相似，即
layout：insert和layout：replace 。 他们或多或少都这样做。 与我们之前讨论的处理器不同，这两个处理器没有使用分层方法，而是使用了包容性方法。 这是胸腺嘧啶形式的更多特征。
该图显示了最终的页面视图。 它同时具有页眉和页脚，尽管在index.html标记中均未提及。