1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>form表单</title> 5 <meta charset="utf-8"> 6 </head> 7 8 <body> 9 <!-- 10 action 表单提交的位置 11 method 表单提交的方式 12 post 密文提交 13 get明文提交 14 15 --> 16 <form action="http://www.baidu.com" method="get"> 17 <center> 18 <caption>人员信息采集</caption> 19 <hr/> 20 <table cellpadding="1" cellspacing="0"> 21 <tr> 22 <td><label for="username">姓名:</label></td> 23 <td><input type="text" name="username" size="10" maxlength="6"/></td> 24 </tr> 25 <tr> 26 <td>密码:</td> 27 <td><input type="password" name="password" size="10" maxlength="6"/></td> 28 </tr> 29 <tr> 30 <td>性别:</td> 31 <td> 32 <input type="radio" name="sex" checked="checked" value="0"/>男 33 <input type="radio" name="sex" value="1"/>女 34 <input type="radio" name="sex" value="2"/>保密 35 </td> 36 </tr> 37 <tr> 38 <td>兴趣:</td> 39 <td> 40 <input type="checkbox" name="inst" value="music"/>音乐 41 <input type="checkbox" name="inst" value="game"/>打游戏 42 <input type="checkbox" name="inst" value="study"/>学习 43 </td> 44 </tr> 45 <tr> 46 <td> 47 家庭住址: 48 </td> 49 <td> 50 <select name="province"> 51 <option value="anhui">安徽省</option> 52 <option value="shandong" selected="selected">山东省</option> 53 <option value="shanxi">山西省</option> 54 </select> 55 <select name="city"> 56 <option value="jinan">济南市</option> 57 <option value="qingdao" selected="selected">青岛市</option> 58 <option value="taian">泰安市</option> 59 </select> 60 <select name="area"> 61 <option value="xihaian">西海岸新区</option> 62 <option value="shinan">市南区</option> 63 <option value="shibei" selected="selected">市北区</option> 64 </select> 65 </td> 66 </tr> 67 <tr> 68 <td>出生年月:</td> 69 <td><input type="date" name="date"></td> 70 </tr> 71 <tr> 72 <td>邮件:</td> 73 <td><input type="email" name="email"></td> 74 </tr> 75 <tr> 76 <td>请选择上传的文件</td> 77 <td><input type="file" name="file" accept="image/png"></td> 78 </tr> 79 <tr> 80 <td>个性签名</td> 81 <td> 82 <textarea rows="10" cols="30"></textarea> 83 </td> 84 </tr> 85 <tr> 86 <td colspan="2" align="center"> 87 <input type="submit" value="提交"/> 88 <input type="reset" value="重置"/> 89 <button type="button">Click Me!</button> 90 </td> 91 </tr> 92 </table> 93 </center> 94 </form> 95 </body> 96 97 </html>