Spring Thymeleaf 文档

1.引入CSS

<link rel="stylesheet" th:href="@{/css的相对路径.css}">

2.引入JS

<script th:src="@{/js的相对路径.js}"></script>

3.放行资源文件

@Override

public void init(WebSecurity web) throws Exception {

	web.ignoring().antMatchers("/plugins/**");

	web.ignoring().antMatchers("/css/**");

	web.ignoring().antMatchers("/js/**");

	web.ignoring().antMatchers("/img/**");

	super.init(web);

}

4.表单的Action这样写

<form th:action="@{/login}" method="post">

5.片段

<div th:fragment="片段名称">

代码片断放在/src/main/resources/templates/fragments目录下

写代码片断

<!DOCTYPE html>

<html xmlns:th="http://www.thymeleaf.org">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<head th:fragment="common_header(title,links)">

    <title th:replace="${title}">The awesome application</title>

    <meta charset="utf-8">

  	<meta http-equiv="X-UA-Compatible" content="IE=edge">

  	<meta name="viewport" content="width=device-width, initial-scale=1">

  	<link rel="stylesheet" th:href="@{/plugins/fontawesome-free/css/all.min.css}">

  	<link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">

  	<link rel="stylesheet" th:href="@{/css/adminlte.min.css}">

    <th:block th:replace="${links}" />

</head>

</body>

</html>
<!DOCTYPE html>

<html xmlns:th="http://www.thymeleaf.org">

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

</head>

<body>

	<div data-th-fragment="js">

		<script th:src="@{/plugins/jquery/jquery.min.js}"></script>

		<script th:src="@{/plugins/bootstrap/js/bootstrap.bundle.min.js}"></script>

		<script th:src="@{/js/adminlte.min.js}"></script>

		<script th:src="@{/js/demo.js}"></script>

	</div>

</body>

</html>

引用片断

<head th:replace="fragments/head :: common_header(~{::title},~{})">

<title>添加Hello</title>

</head>

 

<div th:replace="fragments/js :: js">...</div>

  

posted @ 2020-08-12 10:32  麦克斯-侯  阅读(273)  评论(0编辑  收藏  举报
百纵科技