html5新增的表单控件

表单新增的控件

 

 1 表单中新增的控件(type属性)
 2     email: 提交表单时检测值是否是一个电子邮件格式
 3     url: 提交表单时检测值是否是一个url格式
 4     date: 年-月-日格式的控件
 5     time: 时:分格式的控件
 6     datetime: 年-月-日 时:分 格式的控件（UTC时间）
 7     datetime-local: 年-月-日 时:分 格式的控件（本地时间）
 8     month: 年-月格式的控件
 9     week: 年-周数格式的控件
10     number: 数字输入框
11     <input type="number" name="" id="" value="60" max="100" min="0" />
12     range: 选择区域
13     <input type="range" name="" id="" value="60" max="100" min="0" />
14     tel: 电话输入框
15     search: 用于搜索
16     color: 调用系统选色器

表单控件属性

 1 新增控件属性：
 2     placeholder: 占位符，输入框提示信息
 3     <input type="text" autofocus placeholder=''/>
 4     required: 该input为必填项
 5     autofocus: 在页面加载时，域自动地获得焦点
 6     autocomplete="off/on":可以记录输入信息  
 7     必须有name属性  必须提交过
 8     off==>关闭     on==>打开
 9     <input type="tel" name="user" id="" value="" autocomplete="on"/>
10     pattern: 正则验证 
11     <input type="tel" pattern="[0-9]{7,12}"/>
12     min/max: input能输入的最小/最大字节的长度
13     step: 针对number和range类型，每次递增step的值
14     list: 指定一个datalist，作为下拉提示单

 

posted @ 2021-08-10 17:40  悠哉de小猫  阅读(252)  评论(0)    收藏  举报