h5新增标签.属性

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/moli-/p/12932146.html