首先导入依赖
<dependency>
<groupId>org.webjars</groupId>
<artifactId>bootstrap</artifactId>
<version>3.3.5</version>
</dependency>
<dependency>
<groupId>org.webjars</groupId>
<artifactId>jquery</artifactId>
<version>3.1.1</version>
</dependency>
然后把后台功能写完,写前端,代码如下
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>学生成绩</title>
<script src="webjars/jquery/3.1.1/jquery.min.js" th:src="@{webjars/jquery/3.1.1/jquery.min.js}"/>
<script src="webjars/bootstrap/3.3.5/js/bootstrap.min.js"
th:src="@{webjars/bootstrap/3.3.5/js/bootstrap.min.js}"/>
<link href="webjars/bootstrap/3.3.5/css/bootstrap.min.css"
th:href="@{webjars/bootstrap/3.3.5/css/bootstrap.min.css}" rel="stylesheet"/>
</head>
<body>
<form class="form-inline" method="post" action="/findOne">
<input class="form-group form-control" type="text" name="name" placeholder="姓名"/>
<input class="form-group form-control" type="text" name="store" placeholder="成绩"/>
<button class="btn btn-default" type="submit">搜索</button>
</form>
<table class="table table-bordered">
<thead>
<th>学号</th>
<th>姓名</th>
<th>成绩</th>
<th>头像</th>
<th>删除</th>
<th>修改</th>
<th><a th:href="@{editOneStudent(id=0)}">增加</a></th>
</thead>
<tbody th:each="i:${stu}">
<tr>
<td><span th:text="${i.id}"></span></td>
<td><span th:text="${i.name}"></span></td>
<td><span th:text="${i.store}"></span></td>
<td><img th:src="@{${i.imgpath}}" width="50px" height="50px"/></td>
<td><a th:href="@{delStudent(id=${i.id})}">删除</a></td>
<td><a th:href="@{editOneStudent(id=${i.id})}">修改</a></td>
</tr>
</tbody>
</table>
<nav aria-label="Page navigation">
<ul class="pagination">
<li th:switch="${pageNum}">
<a th:case="1" th:href="@{/findStudent(pageNum=1)}" aria-label="Previous" class="disabled">
<span aria-hidden="true">«</span>
</a>
<a th:case="*" th:href="@{/findStudent(pageNum=${pageNum-1})}" aria-label="Previous">
<span aria-hidden="true">«</span>
</a>
</li>
<li th:switch="${pageNum}">
<a th:case="${pageCount}" th:href="@{/findStudent(pageNum=${pageCount})}" aria-label="Next"
class="disabled">
<span aria-hidden="true">»</span>
</a>
<a th:case="*" th:href="@{/findStudent(pageNum=${pageNum+1})}" aria-label="Next">
<span aria-hidden="true">»</span>
</a>
</li>
</ul>
</nav>
</body>
</html>
网页显示如下
然后百度了一下看了一下thymeleaf的语法,把标签格式改了下
就可以了