register.html 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>用户注册</title>
  6. <style>
  7. #container {
  8. width: 400px;
  9. margin: 0 auto;
  10. }
  11. .input, form+a {
  12. margin: 20px 20px;
  13. width: 250px;
  14. }
  15. .input>label {
  16. display: inline-block;
  17. width: 80px;
  18. text-align: right;
  19. }
  20. .input:last-child {
  21. text-align: center;
  22. }
  23. input[type=text], input[type=password] {
  24. outline: none;
  25. }
  26. input[type=submit], input[type=reset] {
  27. width: 60px;
  28. }
  29. form+a {
  30. text-decoration: none;
  31. color: blue;
  32. }
  33. .hint {
  34. margin-left: 20px;
  35. color: red;
  36. font-size: 0.8em;
  37. height: 20px;
  38. }
  39. .mobile {
  40. width: 300px;
  41. }
  42. .photo {
  43. width: 350px;
  44. }
  45. .preview {
  46. margin: 10px 50px;
  47. }
  48. .intro {
  49. width: 720px;
  50. }
  51. </style>
  52. </head>
  53. <body>
  54. <div id="container">
  55. <h1>用户注册</h1>
  56. <hr>
  57. <form action="" method="post">
  58. <div class="input">
  59. <label>用户名:</label>
  60. <input type="text" name="username" required minlength="4" maxlength="20">
  61. </div>
  62. <div class="input">
  63. <label>密码:</label>
  64. <input type="password" name="password">
  65. </div>
  66. <div class="input">
  67. <label>确认密码:</label>
  68. <input type="password" name="repassword">
  69. </div>
  70. <div class="input mobile">
  71. <label>手机号:</label>
  72. <input type="tel" name="tel">
  73. <input type="button" id="sendBtn" value="发送验证码">
  74. </div>
  75. <div class="input">
  76. <label>验证码:</label>
  77. <input type="text" name="mobilecode">
  78. </div>
  79. <div class="input">
  80. <input type="submit" value="注册">
  81. <input type="reset" value="重置">
  82. </div>
  83. </form>
  84. <a href="login.html">返回登录</a>
  85. </div>
  86. </body>
  87. </html>