HTML 表单
表单是一个包含表单元素的区域
表单元素是允许用户在表单中输入内容. 比如:文本域(textarea) / 下拉列表等等
表单使用表单标签<form></form>
来设置
action 用户提交的数据提交到的位置
method 用户的提交方式
post 传输的数据量更大 更安全
get 传输的数据量更小
HTML表单标签
标签 | 描述 |
---|---|
<form> | 供用户输入的菜单 |
<input> | 输入域 |
<textarea> | 文本域 |
<button> | 点击按钮 |
<select> | 下拉菜单 |
<option> | 下拉项 |
selected | 下拉项默认选中 |
type | 表单项的类型 |
text | 文本域 |
password | 密文域 |
submit | 提交按钮 |
reset | 重置按钮 |
radio | 单选按钮 |
checkbox | 多选按钮 |
file | 本地文件上传 |
name | 名称 |
value | 默认值 |
readonly | 只读 |
disable | 禁用 |
checked | 默认选中.单选多选 |
案例 :
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8"/>
</head>
<body>
<h1>form表单</h1>
<form action="" method="post">
<h2>注册</h2>
用户名:<input type="text" name="username" value=""><br/><br/>
密 码:<input type="password" name="userpass"><br/><br/>
性别:<input type="radio" name="sex" value="0">男
<input type="radio" name="sex" value="1">女
<input type="radio" name="sex" value="2">妖<br/><br/>
爱好:<input type="checkbox" name="body[]" value="0">吃
<input type="checkbox" name="body[]" value="1">睡
<input type="checkbox" name="body[]" value="2">LOL<br/><br/>
大头贴:<input type="file" name="pic"><br/><br/>
国家:<select name="addrest">
<option value="0" >China</option>
<option value="1">American</option>
</select><br/><br/>
个性签名:<textarea name="jian" rows="3" cols="30"></textarea>
<input type="submit" value="登录"/>
<input type="reset" value="取消"/><br>
颜色 : <input type="color" name="">
滑块 : <input type="range" name="r" max="99" min="1" value="0">
</form>
</body>
</html>
效果图 :