本文导读
- 现在使用Spring Boot来开发一个实际开发中功能全面项目,它可以将前面学到真知识进行一个整合
- 因为篇幅较长,采用每个功能一篇文章的方法进行,所以这会是一个系列
新建 web 项目
引入静态资源
application.properties
server.servlet.context-path=/tiger
index.html
<!DOCTYPE html>
<!--xmlns写上之后 Thymeleaf就会有提示,更加方便-->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Signin Template for Bootstrap</title>
<!-- Bootstrap core CSS
如果没有导入bootstrap的webjars包,则不要使用th:href覆盖掉原来静态文件夹目录下的文件-->
<link href="asserts/css/bootstrap.min.css" th:href="@{/webjars/bootstrap/4.0.0/css/bootstrap.css}" rel="stylesheet">
<!-- Custom styles for this template
理解原来之后就知道,下面th:href取值就是覆盖掉默认的href属性值,好处是可以不和前端人员代码发生冲突
thymeleaf的@{}表达式会自动加上"/应用上下文路径"前缀,这就避免了传统jsp中的${request.context.path}这种操作了
-->
<link href="asserts/css/signin.css" th:href="@{/asserts/css/signin.css}" rel="stylesheet">
</head>
<body class="text-center">
<form class="form-signin" method="post">
<!-- 取值替换原来默认的值-->
<img class="mb-4" th:src="@{/asserts/img/bootstrap-solid.svg}" src="asserts/img/bootstrap-solid.svg" alt=""
width="72" height="72">
<h1 class="h3 mb-3 font-weight-normal">Please sign in</h1>
<label class="sr-only" >Username</label>
<input type="text" name="username" class="form-control" placeholder="Username"
required="" autofocus="">
<label class="sr-only" >Password</label>
<input type="password" name="password" class="form-control" placeholder="Password"
required="">
<div class="checkbox mb-3">
<label>
<input type="checkbox" value="remember-me"/> Remember me
</label>
</div>
<button class="btn btn-lg btn-primary btn-block" type="submit" >Sign in</button>
<p class="mt-5 mb-3 text-muted">© 2017-2018</p>
<a class="btn btn-sm">中文</a>
<a class="btn btn-sm">English</a>
</form>
</body>
</html>
运行测试