H5新增input标签
1.电子邮件
<input type="email" name="email"/>
默认正则:输入内容必须有@符号,@后面必须有内容
2.搜索框
<input type="search" name="search"/>
3.url地址
<input type="url" name="url"/>
默认正则:必须包含http:或者https:
4.电话号码
<input type="tel" name="tel"/>
5.数字
<input type="number" name="num" step="5" min="5" max="50"/>
默认正则:只能输入数字 ,会有步长,默认步长为1
6.color(调色盘)
<input type="color" name="color"/>
7.range(范围条)
<input type="range" name="range" min="0" max="10" step="2" value="10"/>
注意:
-范围类型:
min:最小值
max:最大值
step:步长
value:总长
8.日历date
<input type="date" name="date"/>
<input type="week" name="week"/>
<input type="time" name="time"/>
注意:实际开发中基本不用,因为丑
H5新增input标签的更多相关文章
- h5新增html标签语义
H5新增常用标签<body> <header>...</header> <nav>...</nav> <article> < ...
- H5新增的标签和属性
声明 Web 世界中存在许多不同的文档.只有了解文档的类型,浏览器才能正确地显示文档. HTML 也有多个不同的版本,只有完全明白页面中使用的确切 HTML 版本,浏览器才能完全正确地显示出 HTML ...
- 08 H5新增input元素
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- H5新增的标签总结
1:便于排版的Form表单 HTML5为了方便排版,可以使form的表单标签脱离form的嵌套. 方法:form指定id,所有的标签标签都添加form= id属性. 例如: <form acti ...
- HTML5新增input标签属性
一. input type属性 <form action=""> 邮箱<input type="email" name="" ...
- H5新增input表单、表单属性
新增表单 email,Email类型 url , Url类型 date,日期类型 time,时间类型 month,月类型 week,周类型 number,数字类型 tel,电话类型 search,搜索 ...
- H5新增的标签以及改良的标签
1>OL标签的改良 start type reversed:翻转排序 2>datalist标签自动补全的使用 3>progress标签的使用:进度条 4>meter标签的应用 ...
- H5 使用input标签上传图片给后台
html代码: <div class="hpk-showimg"> <!-- 营业执照 --> <div class="idcardup&q ...
- h5新增标签及css3新增属性
- h5新增的标签 新增元素 说明 video 表示一段视频并提供播放的用户界面 audio 表示音频 canvas 表示位图区域 source 为video和audio提供数据源 track 为vi ...
随机推荐
- k8s之磁盘挂载持久化
- ActiveMQ之三--JMS-Spring和ActiveMQ整合的完整实
这篇博文,我们基于Spring+JMS+ActiveMQ+Tomcat,做一个Spring4.1.0和ActiveMQ5.11.1整合实例,实现了Point-To-Point的异步队列消息和PUB/S ...
- Win10 x64 pnglib Release
Win10 x64 pnglib Release >------ 已启动生成: 项目: ZERO_CHECK, 配置: Release x64 ------ > Checking Buil ...
- Spring cloud微服务安全实战-5-3后端服务改造
本节来实现一个登陆的效果. 需要一个登陆前的页面和登陆后的页面. 直接粘贴过来的代码 这是一个和后台的绑定 后台要有个autenticated的对象来实现绑定,ts内我们定义这个autenticate ...
- angular2 select 联动
界面操作触发大分类id改变,根据id获取二级分类的数据进行绑定显示. html: <div style="overflow: hidden;float: left;padding-le ...
- Sequelize模型定义
定义 定义模型与表之间的映射,使用 define 方法. Sequelize 会自动增加 createdAt 和 updated 属性,这样能知道一个实例的创建时间和最终修改时间.如果不想自动生成,可 ...
- memmove和memcpy函数的区别及实现
一.memmove()和memcpy()函数和strcpy()函数的区别: (1)使用的类型不同,strcpy()函数只对字符串进行操作:memmove()和memcpy()函数对所有类型都适用,为内 ...
- Ajax的基本使用流程
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- [转帖]Java 2019 生态圈使用报告,这结果你赞同吗?
Java 2019 生态圈使用报告,这结果你赞同吗? http://www.51testing.com/html/94/n-4462794.html 发表于:2019-10-15 17:10 作者: ...
- IAR_EW_MSP430下载
附带完整安装过程,来自本人下载截图. 附带四种花色的花样灯源码和仿真图(ps:不用担心是错的,有疑问欢迎博客留言) 链接:https://pan.baidu.com/s/1ShDRlEQLwkYNOu ...