| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="UTF-8">
- <title></title>
- <style>
- * {
- margin: 0;
- padding: 0;
- font-size: 18px;
- }
- #login label {
- display: inline-block;
- width: 150px;
- text-align: right;
- margin-right: 20px;
- }
- .formitem {
- margin: 20px 0;
- }
- .hint {
- display: inline-block;
- width: 320px;
- font-size: 14px;
- margin-left: 10px;
- }
- .correct {
- color: green;
- }
- .incorrect {
- color: red;
- }
- #login input[type="submit"] {
- display: inline-block;
- width: 120px;
- height: 30px;
- background-color: darkred;
- color: white;
- font-size: 20px;
- line-height: 30px;
- border: none;
- cursor: pointer;
- margin-left: 200px;
- }
- </style>
- </head>
- <body>
- <form id="login" action="" method="post">
- <div class="formitem">
- <label for="username">用户名: </label>
- <input type="text" id="username" name="username">
- <span id="uidHint" class="hint"></span>
- </div>
- <div class="formitem">
- <label for="password">密码: </label>
- <input type="password" id="password" name="password">
- <span id="pwdHint" class="hint"></span>
- </div>
- <div class="formitem">
- <label for="repassword">确认密码: </label>
- <input type="password" id="repassword">
- <span id="rePwdHint" class="hint"></span>
- </div>
- <div class="formitem">
- <label for="tel">手机号: </label>
- <input type="text" id="tel" name="tel">
- <span id="telHint" class="hint"></span>
- </div>
- <div class="formitem">
- <label for="code">验证码: </label>
- <input type="text" id="code" name="code" size="4">
- <input type="button" value="获取验证码">
- </div>
- <div class="formitem">
- <input type="submit" value="立即开通">
- </div>
- <div class="formitem">
- <label for="agreement"></label>
- <input type="checkbox" id="agreement">
- <span class="hint">我同意<a href="#">《XYZ服务协议》</a></span>
- </div>
- </form>
- <script src="js/jquery.min.js" ></script>
- </body>
- </html>
|