<%--
Created by IntelliJ IDEA.
User: 32815
Date: 2023/3/16
Time: 9:49
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>登陆页面</title>
<%-- 引用前端框架Bootstrap的样式和脚本代码 --%>
<link rel="stylesheet" href="script/bootstrap/css/bootstrap.min.css">
<%-- 引用前端框架Bootstrap的脚本以jQuery开发 --%>
<script src="script/jquery/jquery-1.8.3.js"></script>
<script src="script/bootstrap/js/bootstrap.min.js"></script>
</head>
<body>
<%-- 设计登录窗口 --%>
<div style="width: 50%;margin: 100px auto">
<h3 style="text-align: center">登录</h3>
<form class="form-horizontal" action="login" method="post">
<%--
若部署项目有应用的上下文路径(application context):action的属性值只能使用login相对路径
若部署项目没有上下文路径:action的属性值login和/login都可以
--%>
<div class="form-group">
<label for="inputEmail3" class="col-sm-2 control-label">邮箱</label>
<div class="col-sm-10">
<input type="email" class="form-control" id="inputEmail3" placeholder="Email" name="email">
</div>
</div>
<div class="form-group">
<label for="inputPassword3" class="col-sm-2 control-label">密码</label>
<div class="col-sm-10">
<input type="password" class="form-control" id="inputPassword3" placeholder="Password" name="password">
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<div class="checkbox">
<label>
<input type="checkbox"> 记住我
</label>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-default">登录</button>
</div>
</div>
</form>
</div>
</body>
</html>
复制全局css样式水平排列的表单未实现相同的样式
- 邮箱与文本框不在同一行显示
- label文本没有加粗
- 登录按钮没有外边框