1、在html页面中引入模板。
<html xmlns:th="http://www.thymeleaf.org">
2、需要引入css时，代码如下：（js与其类似）
<link th:href="@{/css/a.css}" type="text/css" rel="stylesheet">
3、对于某些页面，我们需要引入其他公共页面的话，在需要引入的区域使用include，如下：
<div th:include="img::${frag}"></div> //img表示另一个页面的（/路径/文件名去掉后缀）,
${frag}表示后台动态传入的fragment名字，我传入的是img，他是另一个页面的fragment名，传入的页面img.html如下：
<!DOCTYPE html> <html xmlns:th="http://www.thymeleaf.org">//注：这句引入必须要有。 <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div th:fragment="img">//${frag}的值为fragment的值 这是模板图片： <img th:src="@{/img/a.png}"> </div> </body> </html>
4、如果需要对后台传过来的时间进行格式化，如下：
<p th:text="${#dates.format(time,'yyyy-MM-dd hh:mm:ss')}"></p> //结果为 2019-04-01 12:55:24
如果不进行格式化，代码如下：
<h3 th:text="${time}"></h3> //结果为Mon Apr 01 12:55:24 CST 2019 显然可读性差
5、对文本进行替换，两种方式，任选：
<span th:text="'welcome to our application, '+${user.phone}"></span> <span th:text="|welcome to our application,${user.phone}|"></span>
6、后台传过来list集合的话，如何循环遍历呢？
<table> <tr th:each="li:${list}">//li为别名，${list}为后台传过来的集合名 <td th:text="${li.phone}"></td> <td th:text="${li.password}"></td> </tr> </table>
7、对数据判断，根据不同的数据类型使用不同的方法，如：对后台传过来的string类型，我们用strings：
<p th:text="${#strings.isEmpty(user.password)?'暂无信息':user.password}"></p>
//为空显示前者：‘暂无信息’，不为空显示string字段。
对于list或者set，代码类似
<p th:if="${#lists.isEmpty(list)}"></p> <p th:if="${#sets.isEmpty(list)}"></p>
8、根据后台传过来的数据进行区分，分别显示不同的内容，可以用if或者switch。
（1）if 后面跟的内容为真，显示对应的，unless刚好相反。
<div th:if="${user.phone=='18438595560'}">//判断为真显示 不错不错 </div> <div th:unless="${user.phone=='18438595560'}">//判断为假显示 不错不错 </div>
如果user.phone从后台传过来是‘18438595560’（我的手机号），则前者显示，后者不显示。
（2）if多条件与switch类型。
<div th:if="${aaa>5}">正确</div> <div th:if="${aaa<5}">错误</div>
（3）switch的用法如下,肯定需要与case搭配。
<div th:switch="${user.phone}"> <p th:case="18438595562"> 是健康女朋友的号码 </p> <p th:case="18438595560"> 是健康的号码 </p> <p>
当然，我们也可以加default
<P th:default> 是其他健康不认识的人的号码 </P>
上面可以用下面的替换，与default效果一致：
<P th:case="*"> 是其他健康不认识的人的号码 </P>
9、select语句，动态加载。
<select> <option th:each="u:${list}" //遍历的集合，u为别名 th:value="${u.phone}" //select的值，此时的optiion值为电话 th:text="${u.phone}" //页面显示的文本 th:selected="${u.phone==user.phone}"> //默认选择的内容 </option> </select>
实际效果如下：
10、动态加载图片，语法如下：
<img th:src="@{/img/{img}(img=${img})}">
如果图片没有拿到，我们为了美观需要默认的图片。可以这样：
<img th:src="@{/{img}(img=${img})}" th:"'this.src=\'' + @{'/img/ss.gif'} + '\''">
th:onerror语法是当前面的图片，从后台拿不到时，我们使用ss.gif替换。
11、提交form表单，我们我们也可以用thymeleaf的语法。
<form th:action="@{/bb}" th:object="${user}" method="post" th:method="post"> <input type="text" th:field="*{phone}"/>//field上传的字段名字 <input type="text" th:field="*{password}"> <input type="submit"> </form>
th:object="${user}",表示我们提交的内容为user对象，在后台直接接收user就行了，下面的字段phone，password都能拿到。
12、为了避免冲突，在前端，一下符合也需要改动。（注：分号不可省）
（1）< ；小于
（2）>；大于
（3）&equals 等于
（4）&le； 小于等于
（5）&ge； 大于等于
<h2>This is <小于</h2> <h2>This is >大于/h2> <h2>This is =;等于/h2> <h2>This is ≤,小于等于/h2> <h2>This is ≥大于等</h2> 13、数据格式化实例
（1）保留两位小数，整数位自动：
<span th:text="${#numbers.formatDecimal(price,0,2)}">34</span> //结果为 11.00
（2）保留两位小数，整数位三位。
<span th:text="${#numbers.formatDecimal(price,3,2)}">34</span> 结果为： 011.00
