目录
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>表单标签测试</title>
</head>
<body>
<!-- 设置提交地址和提交方式 -->
<form action="01-HTML.html" method="get">
<!-- 添加表单项标签:即用户输入信息的标签 -->
<!-- 希望用户提交一些特定的信息,但是考虑到安全问题或者用户操作问题,
不希望该数据发生改变-->
<input type="hidden" name="id" value="123"> <br>
<input type="text" name="pid" value="456" readonly> <br>
<input type="text" name="tid" value="789" disabled> <br>
用户名:<input type="text" name="zhangsan" /> <br>
密码:<input type="password" name="userpwd" /> <br>
<!-- 添加登录与清空按钮 -->
<input type="submit" value="登录" />
<input type="submit" value="清空" /> <br>
<!-- 性别 -->
性别:
<input type="radio" name="gender" value="1" checked> 男
<input type="radio" name="gender" value="0"> 女 <br>
爱好:
<input type="checkbox" name="hobby" value="1"> 足球
<input type="checkbox" name="hobby" value="2"> 排球
<input type="checkbox" name="hobby" value="3"> 羽毛球
<input type="checkbox" name="hobby" value="4"> 铅球 <br>
个人简介:
<!-- 没有value属性 -->
<textarea name="intro" style="width: 500;height: 1000;"></textarea> <br>
选择头像:<input type="file"> <br>
籍贯:
<select name="address">
<option value="1">京</option>
<option value="2">津</option>
<option value="3">冀</option>
<option value="4">请选择</option>
</select>
</form>
</body>
</html>
注意:
name:表单元素的名字,方便后台区分每个表单元素;
value:作为提示信息给用户 / 后台人员查看选择的信息;
1. 单选框 radio
2. 复选框 checkbox
3. 隐藏域 hidden
隐藏域不显示在页面上,提交时会携带;