HTML5-新增表单类型和表单属性

新增表单类型

• number 只允许输入数字（字母 e 除外）

  • 可以通过 max 和 min 属性设置输入范围

  <input type="number" name="" max="99" min="0" />
  

• tel 手机号码输入框

• search 搜索框

• color 用于选取颜色

• date 日期选择器（年月日）

• month 选择月份（年、月）

• week 周（年、第几周）

• time 时间（小时、分钟）

• email 用于校验邮箱格式

• url 网址形式的路径（例如：http://www.csdn.net）

• range 范围，显示为滑动条

  • 通过 max 和 min 设置限定，滑块位置默认居中

  <input type="range" name="" max="66" min="0" value="20">
  

新增表单属性

• placeholder 输入框中的提示文本（占位符）；属性值为一段提示文本

  <input placeholder="这是一段提示信息"/>
  

• multiple 可选择多个值（例如：上传多个文件）；属性值为 multiple

  <input type="file" name="myFiles" multiple="multiple" />
  

• required 设置为必填，当前所填项不能为空；属性值为 required
• autofocus 在页面加载时自动聚焦；属性值为 autofocus
• autocomplete 自动完成
  • 属性值为 on（开启）或 off（关闭） 设置该属性后，在表单提交后会自动记录用户输入的内容
  • 该属性在 form 标签中默认为 on ，在 input 标签中默认为 off
  • 使用该属性的 input 标签必须设置 name 属性
• max 设置输入字段的最大值，通常与 min 结合使用；属性值为 number（数值）或 date（日期）

  <input type="date" name="bday" max="2022-12-31" />
  

• min 设置输入字段的最小值