HTML综合案例

た 入场券 2022-12-16 04:57 238阅读 0赞
  1. <!DOCTYPE html>
  2. <html lang="zh-CN">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>注册</title>
  7. </head>
  8. <body>
  9. <h3>青春不常在,抓紧谈恋爱</h3>
  10. <table>
  11. <tr>
  12. <td>性别</td>
  13. <td>
  14. <form>
  15. <label for="nan"></label>
  16. <input type="radio" name ="sex" id="nan">
  17. <label for="nv"></label>
  18. <input type="radio" name ="sex" id="nv">
  19. </form>
  20. </td>
  21. </tr>
  22. <tr>
  23. <td>生日</td>
  24. <td>
  25. <form>
  26. <select>
  27. <option>2002年</option>
  28. <option>2001年</option>
  29. <option>2000年</option>
  30. <option>1999年</option>
  31. <option>1998年</option>
  32. <option>1997年</option>
  33. <option>1996年</option>
  34. <option>1995年</option>
  35. <option>1994年</option>
  36. <option>1993年</option>
  37. <option>1992年</option>
  38. <option>1991年</option>
  39. <option>1990年</option>
  40. <option>1989年</option>
  41. <option>1988年</option>
  42. </select>
  43. <select>
  44. <option>1月</option>
  45. <option>2月</option>
  46. <option>3月</option>
  47. <option>4月</option>
  48. <option>5月</option>
  49. <option>6月</option>
  50. <option>7月</option>
  51. <option>8月</option>
  52. <option>9月</option>
  53. <option>10月</option>
  54. <option>11月</option>
  55. <option>12月</option>
  56. </select>
  57. <select>
  58. <option>1日</option>
  59. <option>2日</option>
  60. <option>3日</option>
  61. <option>4日</option>
  62. <option>5日</option>
  63. <option>6日</option>
  64. <option>7日</option>
  65. <option>8日</option>
  66. <option>9日</option>
  67. <option>10日</option>
  68. <option>11日</option>
  69. <option>12日</option>
  70. <option>13日</option>
  71. <option>14日</option>
  72. <option>15日</option>
  73. <option>16日</option>
  74. <option>17日</option>
  75. <option>18日</option>
  76. <option>19日</option>
  77. <option>20日</option>
  78. <option>21日</option>
  79. <option>22日</option>
  80. <option>23日</option>
  81. <option>24日</option>
  82. <option>25日</option>
  83. <option>26日</option>
  84. <option>27日</option>
  85. <option>28日</option>
  86. <option>29日</option>
  87. <option>30日</option>
  88. <option>31日</option>
  89. </select>
  90. </form>
  91. </td>
  92. </tr>
  93. <tr>
  94. <td>所在地区</td>
  95. <td>
  96. <form>
  97. <input type="text" name="diqu" value="请精确到区县" maxlength="30">
  98. </form>
  99. </td>
  100. </tr>
  101. <tr>
  102. <td>婚姻状况</td>
  103. <td>
  104. <label for="weihun">未婚</label>
  105. <input type="radio" name ="婚姻" id="weihun">
  106. <label for="yihun">已婚</label>
  107. <input type="radio" name ="婚姻" id="yihun">
  108. <label for="lihun">离婚</label>
  109. <input type="radio" name ="婚姻" id="lihun">
  110. </td>
  111. </tr>
  112. <tr>
  113. <td>学历</td>
  114. <td>
  115. <input type="text" name="xueli" maxlength="10" value="本科">
  116. </td>
  117. </tr>
  118. <tr>
  119. <td>喜欢的类型</td>
  120. <td>
  121. <form>
  122. <label for="wumei">妩媚的</label>
  123. <input type="checkbox" name ="喜欢的类型" id="wumei">
  124. <label for="keai">可爱的</label>
  125. <input type="checkbox" name ="喜欢的类型" id="keai">
  126. <label for="xiaoxianrou">小鲜肉</label>
  127. <input type="checkbox" name ="喜欢的类型" id="xiaoxianrou">
  128. <label for="laolarou">老腊肉</label>
  129. <input type="checkbox" name ="喜欢的类型" id="laolarou">
  130. </form>
  131. </td>
  132. </tr>
  133. <tr>
  134. <td>自我介绍</td>
  135. <td>
  136. <form>
  137. <textarea cols="20" rows="5">请进行简单的自我介绍</textarea>
  138. </form>
  139. </td>
  140. </tr>
  141. <tr>
  142. <td></td>
  143. <td>
  144. <input type="submit" value="免费注册">
  145. </td>
  146. </tr>
  147. <tr>
  148. <td></td>
  149. <td>
  150. <form>
  151. <input type="radio" checked="checked">我同意注册条款和会员加入标准
  152. </form>
  153. </td>
  154. </tr>
  155. <tr>
  156. <td></td>
  157. <td>
  158. <dl>
  159. <dt>我承诺</dt>
  160. <dd>·年满18岁</dd>
  161. <dd>·抱着严肃的态度</dd>
  162. <dd>·真诚寻找另一半</dd>
  163. </dl>
  164. </td>
  165. </tr>
  166. </table>
  167. </body>
  168. </html>

在这里插入图片描述

发表评论

表情:
评论列表 (有 0 条评论,238人围观)

还没有评论,来说两句吧...

相关阅读

    相关 HTML综合案例练习

    一、展示简历内容 可以首先看一下我们的效果,之后再思考怎么实现 ![\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-6a8XAHrq-1