1 <!DOCTYPE html> 2 <html> 3 <head> 4 <!--解决乱码 ，告诉浏览器文档类型和编码 5 http-equiv:描述当前网页内容类型 6 context：使用的是html的文本 7 charset：使用的编码是UTF-8,解码也使用UTF-8 8 --> 9 <meta http-equiv="Content-Type" content="text/html" charset="UTF-8"> 10 <title>Insert title here</title> 11 </head> 12 <body> 13 <!-- 14 form表单标签：要提交的内容，使用该标签包裹 15 action属性:决定表单提交到哪里 16 method属性：决定表单的提交方式get/post get(默认值)/post 17 post和get区别： 18 1.post提交 (http 请求正文中)键值对没有在地址栏上，而get是放在地址栏上 19 2.安全性上post更高一些 20 3.长度上：get因为是放到地址栏中，长度受限,2K. post 理论上是无限的 21 22 input标签：表单项标签 23 type类型: 24 text 文本框 25 password 密码框 26 radio 单选框 27 file 文件上传 28 hidden 隐藏域 29 submit 提交 30 reset 重置 31 image 提交(图片) 32 button 按钮 33 name属性： 34 对于表单项：提交时键值对的键 35 value属性： 36 1.对于需要提交的表单项：提交的值 37 2.按钮类型的：按钮上显示的文字 38 readonly属性： 39 只读属性,只是限制value属性的变化. 40 只能给text和password textarea使用 41 disabled属性： 42 禁用的效果：颜色变化，不参与提交 43 适用范围：所有input标签 44 checked属性: 45 默认被选中. 46 只适用于： 1 radio 2 checkbox 47 maxlength属性：定义最大长度 48 size属性：定义输入框显示长度 49 以上连个属性只能放在text和password中 50 51 select标签: 52 下拉选 53 name属性：提交的键 54 size属性：同时显示的选项个数 55 multiple属性:多选 56 selected属性：让option默认被选中 57 textarea标签： 58 文本域 59 name属性：提交的键 60 col属性：列宽 61 row属性：行高 62 readonly属性：只读 63 64 --> 65 <form action="#" method="post"> 66 <table border="1"> 67 <tr> 68 <th colspan="3">用户注册</th> 69 </tr> 70 <tr> 71 <td>用户名：</td> 72 <td><input type="text" name="name" value="123" maxlength="5"/></td> 73 </tr> 74 <tr> 75 <td>密码:</td> 76 <td><input type="password" name="pwd" disabled /></td> 77 </tr> 78 <tr> 79 <td>性别:</td> 80 <td> 81 女<input type="radio" name="sex" value="0" /> 82 男<input type="radio" name="sex" value="1" checked/> 83 </td> 84 </tr> 85 <tr> 86 <td>爱好</td> 87 <td> 88 抽烟<input type="checkbox" name="habit" vlaue="smoke" /> 89 喝酒<inputtype="checkbox" name="habit" vlaue="drink" /> 90 </td> 91 </tr> 92 <tr> 93 <td>学历：</td> 94 <td> 95 <select name="edu" size="10"> 96 <option value="00">请选择学历</option> 97 <option value="01">高中</option> 98 <option value="02">大专</option> 99 <option value="03">大本</option> 100 <option value="04">硕士</option> 101 </select> 102 </td> 103 </tr> 104 <tr> 105 <td>上传照片:</td> 106 <td><input type="file" name="photo" /></td> 107 </tr> 108 <tr> 109 <td>个人描述:</td> 110 <td><textarea name="desc" cols="50" rows="10">这家伙很懒</textarea></td> 111 </tr> 112 <tr> 113 <td>隐藏域：</td> 114 <td><input type="hidden" name="secret" value="张三" /></td> 115 </tr> 116 <tr> 117 <td>其他：</td> 118 <td><input type="image" /></td> 119 </tr> 120 <tr> 121 <td colspan="2" align="center"><input type="submit" value="提交" /><input 122 type="reset" /></td> 123 </tr> 124 125 </table> 126 </form> 127 </body> 128 </html>