/*
*作者：呆萌老师
*☑csdn认证讲师
*☑51cto高级讲师
*☑腾讯课堂认证讲师
*☑网易云课堂认证讲师
*☑华为开发者学堂认证讲师
*☑爱奇艺千人名师计划成员
*在这里给大家分享技术、知识和生活
*各种干货，记得关注哦！
*/
表单标签
表单: form:所有的表单元素都是放在form中提交到服务器端
属性: action:提交的页面地址
method:提交的方式
get:提交的内容都会通过url传递,不安全，传递的内容长度有限制
post:提交的内容会加密，通过正文传递，可以提交大量数据
表单元素:
1)输入框
《1》文本框：<input type="text" name="必须的" />
《2》密码框：<input type="password" name="必须的" />
《3》单选框：<input type="radio" name="必须的" />
注意：
同组的单选按钮名称(name) 必须相同，才能彼此互斥
《4》复选框：<input type="checkbox" />
《5》按钮 ：
普通按钮：<input type="button" />
重置按钮：<input type="reset" />
提交按钮：<input type="submit" />
图片按钮：<input type="image" src="图片的路径" />
注意： 默认有 表单提交功能的是 ： submit / image
《6》隐藏域：<input type="hidden" />
《7》上传文件：<input type="file" />
<input type="text" size="20" value="客户输入的值或者默认的值"/>密码:<input type="password" value="123456"/>
性别:<input type="radio" name="sex" value="1" checked="checked"/>男
<input type="radio" name="sex" value="2"/>女
爱好:<input type="checkbox" value="1" checked="checked"/>吃饭
<input type="checkbox" value="2" checked="checked"/>睡觉
<input type="checkbox" value="3"/>打豆豆
上传控件:<input type="file"/>
隐藏框:<input type="hidden" value="商品id" />
<input type="submit" value="注册" />
<input type="reset" value="取消"/>
<input type="button" value="普通按钮"/>
图片提交按钮:<input type="image" src="img/27125326.jpg"
2) 多行文本框
<textarea cols="列数目" rows="行数目"</textarea>留言:<textarea rows="4" cols="30"> </textarea>
<select >
<option value="必须的">文本值</option>
</select>
<select><option value="1">请选择</option>
<option selected="selected" value="2">你的妈妈叫什么名字?</option>
<option value="3">你的爸爸叫什么名字?</option>
<option value="4">你最喜欢的电影?</option>
</select>
下拉列表框可以设置为多选:
<select multiple="multiple" size="3">
<option value="1">请选择</option>
<option selected="selected" value="2">你的妈妈叫什么名字?</option>
<option value="3">你的爸爸叫什么名字?</option>
<option value="4">你最喜欢的电影?</option>
</select>
4) HTML 5 中扩展的 表单标记
<1> <input type="tel" pattern="\d{8}" />
<2> <input type="email" />
<3> <input type="url" />
<4> <input type="color" />
<5> <input type="search" />
<6> <input type="number" />
<7> <input type="range" />
<8> <input type="date|time|datetime|month|week|datetime-local" />
<9><input type="text" list="data2" />
<datalist id="data2">
<option value="百度"></option>
<option value="谷歌"></option>
<option value="必应"></option>
</datalist>
颜色:<input type="color"/>邮箱:<input type="email"/>
日期:<input type="date"/>
搜索:<input type="search" />
提示框<input type="text" list="data"/>
<datalist id="data">
<option>html5</option>
<option>html4</option>
</datalist>
5) HTML 5 中扩展的 表单标记 的属性
<1> 定义正则表达式： pattern="\d{8}"
<2> min="1" max="100" step="5"
<3> form="某个<form>标记的 ID属性" : 定义表单元素属于哪一个表单
<4> placeholder="请输入您的联系方式" : 文本框中的 默认的灰色提示信息，用户输入时会自动消失
<5> required="required" : 用来定义表单元素为【必填】项
电话:<input type="text" pattern="\d{11}" />用户名:<input type="text" required="required" placeholder="请输入用户名" />
<input type="submit" name="注册" disabled="disabled" />
更多了解
https://edu.51cto.com/course/20516.html