1:便于排版的Form表单

HTML5为了方便排版,可以使form的表单标签脱离form的嵌套。

方法:form指定id,所有的标签标签都添加form= id属性。

例如:

<form action="" method="post" id="register"></form>

<input type="text" name="user" value="" form="register" />

<input type="password" name="pwd" value="" form="register" />

2:form新类型

type = "email" 邮箱(自带格式校验)

type = "url"   网址,必须带协议(自带格式校验)

type = "date"  日期选择器

type = "time" 时间选择器

type = "month" 月份选择器

type = "week" 周选择器

type = "number" 数字选择器

type = "range" 滑动条

max属性

step属性(验证合法性) step="2",例如从0开始,只能选择0-2-4-6-8

type = "search" 搜索框

results="n"谷歌浏览器可用,显示搜索图标。

type = "color" 颜色选择器

3:新增的表单属性

required="required" 设置必填项

placeholder = "我是默认值" 设置默认值,不会提交到后台

autofocus = "autofocus" 自动聚焦

pattern="\d{3}" 自定义正则表达式

4:自动填充表单

<input type="text" name="auto" value="" list="movie" />

<datalist id="movie">

<option>人在囧途</option>

<option>车在囧途</option>

<option>泰囧</option>

</datalist>

5:output标签

<form action="" method="post"

oninput="result.value=parseInt(no1.value)+parseInt(no2.value)">

<input type="number" name="no1" value="" />

<input type="number" name="no2" value="" />

<output name="result"></output>

</form>

H5新增的标签总结的更多相关文章

  1. h5新增html标签语义

    H5新增常用标签<body> <header>...</header> <nav>...</nav> <article> < ...

  2. H5新增的标签和属性

    声明 Web 世界中存在许多不同的文档.只有了解文档的类型,浏览器才能正确地显示文档. HTML 也有多个不同的版本,只有完全明白页面中使用的确切 HTML 版本,浏览器才能完全正确地显示出 HTML ...

  3. H5新增的标签以及改良的标签

    1>OL标签的改良 start type  reversed:翻转排序 2>datalist标签自动补全的使用 3>progress标签的使用:进度条 4>meter标签的应用 ...

  4. H5新增input标签

    1.电子邮件 <input type="email" name="email"/> 默认正则:输入内容必须有@符号,@后面必须有内容 2.搜索框 & ...

  5. h5新增标签及css3新增属性

    - h5新增的标签 新增元素 说明 video 表示一段视频并提供播放的用户界面 audio 表示音频 canvas 表示位图区域 source 为video和audio提供数据源 track 为vi ...

  6. web语义化与h5新增标签

    Web语义化就是html告诉我们也告诉机器这一块是什么内容,例如:“这行是一个标题,这几行组成一个段落,这是一个列表,那是一个链接.”   Web语义化有三个阶段: 1.h1~h6.thead.ul. ...

  7. h5废弃的标签和属性及新增的标签和属性

    一.废弃的标签和属性 1.表现性元素 a) basefont b) big c) center d) font e) strike f) tt 2.框架类元素 a) frame b) frameset ...

  8. H5新增特性之语义化标签

    H5新增特性之语义化标签 语义化标签顾名思义标签有自己的含义,浏览器或者程序员一看就知道是什么.在HTML 5出来之前,我们用div来表示页面章节,但是这些div都没有实际意义.(即使我们用css样式 ...

  9. H5新增API

    H5新增API 选择器 querySelector()和querySelectorAll(),参数都是css选择器,前者返回符合条件的第一个匹配的元素,如果没有则返回Null,后者返回符合筛选条件的所 ...

随机推荐

  1. C# litJson 使用方法

    对一般数据进行序列化和反序列化操作 static void jsonTest() { // JsonData jd = new JsonData(); jd["result"] = ...

  2. C#实现简单的串口通信

    前言 本着学习研究的态度,用c#语言实现简单的串口通信工具. 一.串口通信原理 串口通信 串口通信(Serial Communications)的概念非常简单,串口按位(bit)发送和接收字节.尽管比 ...

  3. JavaScript替换字符串中最后一个字符

    1.问题背景 在一个输入框中,限制字符串长度为12位.利用键盘输入一个数字,会将字符串中最后一位替换,比方:111111111111.再输入一个3,会显示111111111113 2.详细实现 < ...

  4. POJ 1320

    作弊了--!该题可以通过因式分解得到一个佩尔方程....要不是学着这章,估计想不到.. 得到x1,y1后,就直接代入递推式递推了 x[n]=x[n-1]*x[1]+d*y[n-1]*y[1] y[n] ...

  5. 分布式公布订阅消息系统 Kafka 架构设计

    我们为什么要搭建该系统 Kafka是一个消息系统,原本开发自LinkedIn,用作LinkedIn的活动流(activity stream)和运营数据处理管道(pipeline)的基础. 如今它已为多 ...

  6. Android面试题集

    前几天整理了Java面试题集合,今天再来整理下Android相关的面试题集合.假设你希望能得到最新的消息,能够关注https://github.com/closedevice/interview-ab ...

  7. oracle存储过程的使用

    一. 使用for循环游标:遍历全部职位为经理的雇员 1. 定义游标(游标就是一个小集合) 2. 定义游标变量 3. 使用for循环游标 declare -- 定义游标c_job cursor c_jo ...

  8. tomat遇到的一些错误

    资料链接:启动tomcat一闪而过的问题

  9. 0x28 IDA*

    一个早上做完了我真牛B 就是A*用于DFS啊,现在我才发现迭代加深真是个好东西. poj3460 %了%了我们的目标是把它的顺序变对,那么第i个位置的值+1是要等于第i+1个位置的值的.对于一个操作, ...

  10. DNS反射放大攻击分析——DNS反射放大攻击主要是利用DNS回复包比请求包大的特点,放大流量,伪造请求包的源IP地址为受害者IP,将应答包的流量引入受害的服务器

    DNS反射放大攻击分析 摘自:http://www.shaojike.com/2016/08/19/DNS%E6%94%BE%E5%A4%A7%E6%94%BB%E5%87%BB%E7%AE%80%E ...