1.public.html
<!DOCTYPE html> <html lang="en" xmlns:th="http://www.thymeleaf.org"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>1</title> <link rel="stylesheet" href="assets/css/bootstrap.min.css" /> <link rel="stylesheet" href="assets/css/bootstrap-theme.css" /> </head> <body> <div class="container"> <!--顶部导航--> <div class="row" > <div class="nav col-sm-12 " th:fragment="public_top"> <ul class="nav nav-tabs"> <li> <a>首页</a> </li> <li > <a>水果</a> </li> <li class="nav-link active"> <a>自我介绍</a> </li> <li> <a>fuxk</a> </li> </ul> </div> </div> <br /> <!--内容--> <div class="row" > <div class="col-sm-2" > <ul class="nav nav-list" th:fragment="public_left"> <li class="nav-header">List header</li> <li ><a class="nav-link active" href="#" th:href="@{/index3}" th:class="${activeUri=='index3'?'nav-link active':'nav-link'}">Home</a></li> <li class="nav-link"><a href="#" th:href="@{/index2}" th:class="${activeUri=='index2'?'nav-link active':'nav-link'}">Library</a></li> <li><a class="nav-link" href="#" th:href="@{/index1}" th:class="${activeUri=='index1'?'nav-link active':'nav-link'}">Applications</a></li> <li class="nav-header">Another list header</li> <li><a href="#">Profile</a></li> <li class="active"><a href="#">Settings</a></li> <li class="divider"></li> <li><a href="#">Help</a></li> </ul> </div> </div> </div> <script type="text/javascript" src="assets/js/jquery-3.1.1.js"></script> <script type="text/javascript" src="assets/js/bootstrap.min.js"></script> </body> </html> </body> </html> 2. index1.html
<!DOCTYPE html> <html lang="en" xmlns:th="http://www.thymeleaf.org"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <!DOCTYPE html> <html> <head> <meta charset="UTF-8" > <title>1</title> <link rel="stylesheet" href="assets/css/bootstrap.min.css" /> <link rel="stylesheet" href="assets/css/bootstrap-theme.css" /> </head> <body> <div class="container"> <!--顶部导航--> <div class="row" th:insert="~{public :: public_top}"> </div> <br /> <!--内容--> <div class="row"> <div class="col-sm-2" th:insert="~{public :: public_left}"> </div> <div class="col-sm-10"> <table class="table table-hover"> <thead> <tr class="alert-info active table-"> <td><b>名称1</b></td> <td><b>单价1</b></td> <td><b>库存1</b></td> </tr> </thead> <tbody> <tr> <td>番茄1</td> <td>1.11</td> <td>31</td> </tr> <tr> <td>苹果1</td> <td>2.51</td> <td>101</td> </tr> <tr> <td>哈密瓜</td> <td>2.5</td> <td>10</td> </tr> <tr> <td>草莓</td> <td>2.5</td> <td>10</td> </tr> </tbody> </table> </div> </div> </div> <script type="text/javascript" src="assets/js/jquery-3.1.1.js"></script> <script type="text/javascript" src="assets/js/bootstrap.min.js"></script> </body> </html> </body> </html> 3. index2.html
<!DOCTYPE html> <html lang="en" xmlns:th="http://www.thymeleaf.org"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>1</title> <link rel="stylesheet" href="assets/css/bootstrap.min.css" /> <link rel="stylesheet" href="assets/css/bootstrap-theme.css" /> </head> <body> <div class="container"> <!--顶部导航--> <div class="row" th:insert="~{public :: public_top}"> </div> <br /> <!--内容--> <div class="row"> <div class="col-sm-2" th:insert="~{public :: public_left}"> </div> <div class="col-sm-10"> <table class="table table-hover"> <thead> <tr class="alert-info active table-"> <td><b>名称2</b></td> <td><b>单价2</b></td> <td><b>库存2</b></td> </tr> </thead> <tbody> <tr> <td>番茄2</td> <td>2.22</td> <td>21</td> </tr> <tr> <td>苹果1</td> <td>2.51</td> <td>101</td> </tr> <tr> <td>哈密瓜</td> <td>2.5</td> <td>10</td> </tr> <tr> <td>草莓</td> <td>2.5</td> <td>10</td> </tr> </tbody> </table> </div> </div> </div> <script type="text/javascript" src="assets/js/jquery-3.1.1.js"></script> <script type="text/javascript" src="assets/js/bootstrap.min.js"></script> </body> </html> </body> </html> 4.Controller
package com.lulu.Controller; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.RequestMapping; @Controller public class HelloController { @RequestMapping("index") public String goMain() { return "index"; } @RequestMapping("index1") public String goMain1() { return "index1"; } @RequestMapping("index2") public String goMain2() { return "index2"; } @RequestMapping("index3") public String goMain3() { return "index3"; } } 5. 运行效果：
文章来源: https://blog.csdn.net/zhaolulu916/article/details/90517113