网上参考的。

  1. <%@ page language="java" contentType="text/html; charset=utf-8"
  2.  
    pageEncoding="utf-8"%>
  3.  
    <%@ page import="java.util.*" %>
  4.  
    <!DOCTYPE html >
  5.  
    <html>
  6.  
    <head>
  7.  
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  8.  
    <!--修正IE浏览器渲染效果的问题-->
  9.  
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
  10.  
    <!--内容自适应-->
  11.  
    <meta name="viewport" content="width=device-width, initial-scale=1">
  12.  
    <link rel="stylesheet" href="css/bootstrap.css" type="text/css" >
  13.  
    <script type="text/javascript" src="js/jquery.js"></script>
  14.  
    <title>用户登录</title>
  15.  
    <!-- 点击重置按钮清空用户名和密码 -->
  16.  
    <script>
  17.  
    $( document).ready(function(){
  18.  
    $( "#reset").click(function(){
  19.  
    $( "#username").val("");
  20.  
    $( "#pwd").val("");
  21.  
    });
  22.  
    });
  23.  
    </script>
  24.  
    </head>
  25.  
    <body>
  26.  
    <div class="row text-center" style="padding-top:30px; padding-bottom:30px; background-color: #CCC; margin-top:200px;">
  27.  
    <form action="LoginServlet" method="post">
  28.  
    <div class="col-md-6 col-md-offset-3">
  29.  
    <div>
  30.  
    <label>帐号:</label>
  31.  
    <input type="text" id="username" name="username" />
  32.  
    </div>
  33.  
    <div>
  34.  
    <label class="img-circle">密码:</label>
  35.  
    <!-- name很中要,用于后台获取值,一般class修饰样式,id在js中用 -->
  36.  
    <input class="input" id="pwd" name="pwd" type="password" />
  37.  
    </div>
  38.  
    <div style="margin:10px 0px;">
  39.  
    <input class="btn btn-primary" type="submit" value="登录" />
  40.  
    <input class="btn btn-group" id="reset" type="button" value="重置" />
  41.  
    </div>
  42.  
    </div>
  43.  
    </form>
  44.  
    </div>
  45.  
    <script type="text/javascript" src="js/jquery.js"></script>
  46.  
    </body>
  47.  
    </html>

猜你喜欢

转载自www.cnblogs.com/eunji/p/9657027.html