HTML5第三章 表单

表单组件

<form>:表单标签

action:提交路径 method:提交方式（get/post）

<form  method="post/get" action="lujing">

<button>:按钮标签

<input  type="button" name="butButton" value="button按钮"/>

<input>:

name:设置名字

size：设置大小

maxlength:设置最大数值

minlenght:设置最小数值

<p>账号<label for="querenmima">z</label><input id="querenmima" name="3" type="text"value="123"checked="checked"pattern="mima"minlenght="6"maxlength="16"required="required">长度为6-16个字符</p>

type:文本类型

text:文本框/输入框（默认值）

<p>密码<input type="text"name="123"></p>

password:密码框

<p>密码<input type="password"name="123"></p>

radio：单选按钮 name属性值必须一致 checked默认选择

checkbox：复选框/多选框 name属性值必须一致 checked默认选择

button：普通按钮

image：图片按钮 src路径

reset：重置按钮

submit:t提交按钮

flie：文件域 必须在form标签中添加enctype=“multipart/form-data”

email:邮箱

url：网址

search:搜索框

umber:数字框 min最小值 max最大值 step步长

range：滑块 min最小值 max最大值 step步长

tel：电话号

datetime-local：日期选择

color:选择颜色

<a style="color: red;">红色</a>

hidden：隐藏域

<input type="hidden"name="666"value"888" >

标注

<label for="male">标注的文本</label><!--<label>可以在里面加for；color之类的-->
<input type="radio" name="gender" id="male"/>

表单组件属性：

readonly：只读

<p>账号<input type="text"name="666"value"888" readonly></p>

disabled：禁用

<p>账号<input type="text"name="666"value"888" disabled></p>

表单验证

placeholder：输入提示

<p>账号<input type="text"placeholder=“输入账号”></p>

required：非空效验

<!--检查文本框是否为空-->
<p>账号<input type="text"placeholder=“输入账号” required></p>

pattern：正则表达式效验

<input type="text" name="tel"  required pattern="^1[358]\d{9}" />