博客列表 >table和form的使用

table和form的使用

人生如梦
人生如梦原创
2021年11月11日 10:16:15514浏览
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>table</title>
  6. <style>
  7. .bg_blue {
  8. background: #6495ed;
  9. height: 25px;
  10. }
  11. .center {
  12. text-align: center;
  13. }
  14. div {
  15. margin: 10px 0;
  16. }
  17. </style>
  18. </head>
  19. <body>
  20. <table border="1" cellspacing="0">
  21. <tr bgcolor="#6495ed">
  22. <td colspan="5">&nbsp;</td>
  23. </tr>
  24. <tr>
  25. <td colspan="5">------- 基本资料 -------</td>
  26. </tr>
  27. <tr>
  28. <td width="100">姓名:</td>
  29. <td width="100">马小姐</td>
  30. <td width="100">性别:</td>
  31. <td width="100"></td>
  32. <td width="100" rowspan="7"></td>
  33. </tr>
  34. <tr>
  35. <td>学历:</td>
  36. <td>中专</td>
  37. <td>身高:</td>
  38. <td align="right">CM</td>
  39. </tr>
  40. <tr>
  41. <td>籍贯:</td>
  42. <td>广东</td>
  43. <td>出生年月:</td>
  44. <td>1991-12-01</td>
  45. </tr>
  46. <tr>
  47. <td>毕业院校:</td>
  48. <td colspan="3">汕头市目欣科技中学</td>
  49. </tr>
  50. <tr>
  51. <td>主修专业:</td>
  52. <td colspan="3">管理学 => 会计学</td>
  53. </tr>
  54. <tr>
  55. <td>工作经验:</td>
  56. <td>未知</td>
  57. <td>目前年薪:</td>
  58. <td>保密/年</td>
  59. </tr>
  60. <tr>
  61. <td>有效证件:</td>
  62. <td>身份证</td>
  63. <td>证件号码:</td>
  64. <td>**************</td>
  65. </tr>
  66. <tr class="bg_blue">
  67. <td colspan="5"></td>
  68. </tr>
  69. <tr>
  70. <td colspan="5">------- 求职意向 -------</td>
  71. </tr>
  72. <tr class="bg_blue">
  73. <td>寻求职位</td>
  74. <td colspan="4">出纳员,会计文员</td>
  75. </tr>
  76. <tr>
  77. <td>求职地区:</td>
  78. <td colspan="2">罗湖区 福田区</td>
  79. <td>工资待遇:</td>
  80. <td colspan="2">面议</td>
  81. </tr>
  82. <tr>
  83. <td>自我评价:</td>
  84. <td colspan="4">
  85. 本人对等待工作认真负责,本人对等待工作认真负责,本人对等待工作认真负责,本人对等待工作认真负责,本人对等待工作认真负责,本人对等待工作认真负责,本人对等待工作认真负责,本人对等待工作认真负责,本人对等待工作认真负责,本人对等待工作认真负责,本人对等待工作认真负责,本人对等待工作认真负责,
  86. </td>
  87. </tr>
  88. <tr class="bg_blue">
  89. <td colspan="5"></td>
  90. </tr>
  91. <tr>
  92. <td colspan="5">------- 教育培训 -------</td>
  93. </tr>
  94. <tr class="center">
  95. <td>起止时间</td>
  96. <td colspan="2">就读院校名称</td>
  97. <td>主修专业</td>
  98. <td>学历</td>
  99. </tr>
  100. <tr class="center">
  101. <td>2009.09~2012.07</td>
  102. <td colspan="2">汕头市目欣科技中学</td>
  103. <td>会计电算化</td>
  104. <td>中专</td>
  105. </tr>
  106. <tr class="bg_blue">
  107. <td colspan="5"></td>
  108. </tr>
  109. <tr>
  110. <td colspan="5">------- 工作经验(1) -------</td>
  111. </tr>
  112. <tr class="center">
  113. <td>就职公司:</td>
  114. <td colspan="2">深圳XXX电器有限公司</td>
  115. <td>公司行业:</td>
  116. <td>其它</td>
  117. </tr>
  118. <tr class="center">
  119. <td>就职时间:</td>
  120. <td colspan="2">2011年12月</td>
  121. <td>就职部门:</td>
  122. <td>财务部</td>
  123. </tr>
  124. <tr class="center">
  125. <td>公司性质:</td>
  126. <td colspan="2">其它</td>
  127. <td>就职职位:</td>
  128. <td>出纳员</td>
  129. </tr>
  130. <tr>
  131. <td>工作描述:</td>
  132. <td colspan="4">
  133. 本人对等待工作认真负责,本人对等待工作认真负责,本人对等待工作认真负责,本人对等待工作认真负责,本人对等待工作认真负责,本人对等待工作认真负责,本人对等待工作认真负责,本人对等待工作认真负责,本人对等待工作认真负责,本人对等待工作认真负责,本人对等待工作认真负责,本人对等待工作认真负责,
  134. </td>
  135. </tr>
  136. <tr class="bg_blue">
  137. <td colspan="5"></td>
  138. </tr>
  139. <tr>
  140. <td colspan="5">------- 联系方式 -------</td>
  141. </tr>
  142. <tr>
  143. <td>联系电话:</td>
  144. <td colspan="4">134********</td>
  145. </tr>
  146. <tr>
  147. <td>联系手机:</td>
  148. <td colspan="4">134********</td>
  149. </tr>
  150. <tr>
  151. <td>电子邮件:</td>
  152. <td colspan="4">134********@163.com</td>
  153. </tr>
  154. </table>
  155. <br/>
  156. <h3>用户注册</h3>
  157. <form action="" method="post">
  158. <div>
  159. 账号: <input type="text" name="user_name" placeholder="不超过八个字符">
  160. </div>
  161. <div>
  162. 密码: <input type="password" name="pwd" placeholder="6-16个字符">
  163. </div>
  164. <div>
  165. 邮箱: <input type="email" name="email" placeholder="example@mail.com">
  166. </div>
  167. <div>
  168. 年龄: <input type="number" name="age" min="1">
  169. </div>
  170. <div>
  171. 生日: <input type="date" name="birthday">
  172. </div>
  173. <div>
  174. 课程:
  175. <select name="kecheng">
  176. <option value="h5" selected>HTML5</option>
  177. <option value="c3">CSS3</option>
  178. <option value="js">javascript</option>
  179. </select>
  180. </div>
  181. <div>
  182. 爱好:
  183. <label>
  184. <input type="checkbox" name="love[]" value="game"> 打游戏
  185. </label>
  186. <label>
  187. <input type="checkbox" name="love[]" value="video"> 看电影
  188. </label>
  189. <label>
  190. <input type="checkbox" name="love[]" value="code"> 撸代码
  191. </label>
  192. </div>
  193. <div>
  194. 性别:
  195. <label>
  196. <input type="radio" name="sex" value="1">
  197. </label>
  198. <label>
  199. <input type="radio" name="sex" value="2">
  200. </label>
  201. <label>
  202. <input type="radio" name="sex" value="0" checked>保密
  203. </label>
  204. </div>
  205. <div>
  206. 简介:
  207. <textarea rows="15" cols="50" name="desc"></textarea>
  208. </div>
  209. <input type="submit" value="提交">
  210. <input type="button" value="Ajax">
  211. </form>
  212. </body>
  213. </html>

效果预览

声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议