<html>
<head>
<meta charset="UTF-8">
<title>表单标签</title>
</head>
<body>
<!--
form标签:要提交的内容使用该标签包裹
action属性:指定表单提交到哪里
method属性:决定表单的提交方式get(默认值)/post
get和post的区别:
1>post提交(http请求正文中)键值对不在地址栏中显示,get会显示在地址栏中
2>post的安全性高一些
3>get长度受限,post长度理论上不受限
input标签:表单项标签
type属性:
text:文本
password:密码
radio:单选框
checkbox:多选框
hidden:隐藏域
file:文件
submit:提交
reset:重置
name属性:对于表单项,提交时键值对所对应的键
value属性:对于需要提交的表单项,提交时的值
readonly属性:只读属性,适用于text、password和textarea
disabled属性:禁用,颜色变灰。对于所有input都可以使用
checked属性:默认选用,只用于radio和checkbox
maxlength属性:定义输入字符的最大长度
size属性:定义显示输入框的长度
以上两个属性只使用于test和password
select标签:下拉选
name属性:提交的键
size属性:同时显示的选项个数
multiple属性:变成多选
selected属性:默认选中
-->
<form action="#">
<table border="1" method="post">
<tr>
<td colspan="3"align="center"><b>用户注册</b></td>
</tr>
<tr>
<td>用户名:</td>
<td><input type="text" name="name" value="123" maxlength="5"></td>
</tr>
<tr>
<td>密码:</td>
<td><input type="password" name="password"></td>
</tr>
<tr>
<td>性别:</td>
<td>男<input type="radio" name="sex" value="1" checked="checked">
女<input type="radio" name="sex" value="0" ></td>
</tr>
<tr>
<td>爱好:</td>
<td>上网<input type="checkbox" name="habbit" value="surf the Intnet">
打游戏<input type="checkbox" name="habbit" value="playgames">
睡觉<input type="checkbox" name="habbit" value="sleep"></td>
</tr>
<tr>
<td>学历:</td>
<td>
<select name="edu" size="5">
<option value="00">--请选择学历--</option>
<option value="01">初中</option>
<option value="02">高中</option>
<option value="03">大专</option>
<option value="04" selected="selected">本科</option>
<option value="05">硕士</option>
</select>
</tr>
<tr>
<td>上传文件:</td>
<td><input type="file" name="123"></td>
</tr>
<tr>
<td>个人描述:</td>
<td><textarea name="desc" cols="50" rows="10" readonly="readonly">hello welcome</textarea></td>
</tr>
<tr>
<td>隐藏域:</td>
<td><input type="hidden" name="nicai" value="heihei"></td>
</tr>
<tr>
<td colspan="3" align="center"><input type="submit" value="提交">
<input type="reset"></td>
</tr>
</table>
</form>
</body>
</html>
html中表单标签的一些常用用法
最新推荐文章于 2024-07-17 22:23:53 发布