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>