H5新增的标签以及属性

H5的更新加强了浏览器的功能，减少了插件的使用（Flash）。

video 表示一段视频并提供播放的用户界面
audio 表示音频
canvas 表示位图区域

svg 定义矢量图

time 日期和时间值
mark 高亮的引用文字

还有一些语义化标签

<header>头部</header>
<footer>尾部</footer>
<nav>导航栏</nav>
<section>具体的内容</section>
<article>文章</article>
<aside>内容的侧边栏</aside>

<figure> <img src="" alt=""></figure>用作文档中插图的图像，如果要添加标题的话得使用<figcaption></figcaption>并且要必须要放在标签里面

如:

<figure> <img src="" alt="">

<figcaption>这是一张图片</figcaption>

</figure>

<mark>mark标签</mark> 高亮的引用文字

<progress value="0.5"></progress>进度栏标签 value值代表进度，0-1

 

并且添加了一些新的表单控件

email：必须输入邮件；

url：必须输入url地址；

number：必须输入数值；

range：一个滑动栏，并且可以设置最大以及最小值

如：<input type="range" name="range" min="10" max="60">

date：选取日、月、年

month：选取月、年

week：选取周和年

time：选取时间（小时和分钟）

datetime-local：选取时间、日、月、年（本地时间）

search：搜索框

color：颜色

 

以及一些新的属性：

contenteditable="true" 使得文件可以编辑，并且这个属性是可以继承的。

 autocomplete  设置表单成功提交过的数据，下一次有提示   一般会关闭这个功能

placeholder 提示信息

 required  是否必须填写

pattern  正则验证表单内容

multiple 输入框可以输入多个值，一般和email控件一起使用

maxlength 最大长度

minlength 最小长度 

step  规定数字间隔

hidden 隐藏 填写了hidden属性的标签会被隐藏

draggable 元素是否能被拖动

 

 

转载于:https://www.cnblogs.com/yzxyzx/p/11480611.html