form
input
textarea
label
button
代码示例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>表单及表单元素</title>
</head>
<body>
<!--
form 标签
——表单标签，块级元素，会自动换行
—将数据传输给服务器。
—常用属性:
——action·-表单提交的地址url
-id.-——唯一标识
-name .···名称
一target··表单提交打开方式(当前窗口)
-method·提交方式
get请求(默认get)
—参数会自接眼在ur1后面,用问号拼接。
—安全性差。传递的数据量小，效率高(是post速度的两倍)，有缓存
post请求
—参数不会旅在url地址栏后面，会放在请求体中。安全性高,传输数据量大,速度相对来说漫，无缓存。
-->
<!--#提交到当前-->
<form action="#" method="get" id="myform" name="myform">
<!--
表单元素需要设置name属性值，否则数据无法传递！！！
input元素
type表单元素的类型
text文本框
password密码框
radio单选框〔需要设置一组相同的name属性值)
checkbox复选框（需要设置一组相同的name属性值)
button普通按钮
hidden隐藏域〔用来存放需要传递给服务器，但不需要显示的数据)
file文件域(上传文件)
date日期框
submit提交按钮
reset重置按钮
image图片按钮(提交按钮)
value表单元素的值
checked是否选中(单选框/复选框)
disabled 是否禁用
maxlength允许输入的最大字符
textarea文本域
cols和rowslabel标签
设置label标签的for属性值与表单元素的id属性值对应，当点击label标签时，会自动给表单元素聚焦
button按钮
type
button普通按钮
submit提交按钮（默认值)
reset重置按钮
select下拉选项
<select name="">
<option value="值">文本</ option>
</select>
注:当option设置了value属性值时，提交的数据是value对应的值;
如果未设置value，则提交的数据是文本值
常用属性:
value设置值
selected-设置选中状态
-->
编号:<input type="hidden" name="userId" value="1" /> <br>
姓名:<input type="text" value="zhangsan" name="userName" /><br>
密码：<input type="password" name="userPwd" maxlength="6" /><br>
性别：男 <input type="radio" name="userSex" value="man"checked="checked" />
女 <input type="radio" name="userSex" value="woman"checked="checked" /><br>
爱好:唱歌<input type="checkbox" name="userHobby" value="sing"/>
跳舞<input type="checkbox" name="userHobby" value="dance" checked />
说唱<input type="checkbox" name="userHobby" value="rap" disabled="disabled"/>
生日: <input type="date" name="userDate" / ><br>
简介：<textarea name="remark" rows="10">简介</textarea>
头像:<input type="file" name="userHead" /><br>
城市:<select name="city">
<!--加上multiple="multiple"可多选-->
<option >请选择城市</option>
<option value="Beijing">北京</option>
<option value="shanghai">上海</option>
</option><option value="Hangzhou">杭州</option>
</select>
<br>
<input type="button" value="普通按钮"/>
<input type="reset" value="重置按钮"/>
<input type="submit" value="提交按钮"/>
<input type="image" src="./img/8567123.jpg" / width="30%" height="30%">
</form>
</body>
</html>
代码结果