h5的新特性(目前个人所了解)如下
- 语义化标签
- 表单新特性
- 视频(video)和音频(audio)
- canvas画布
- svg绘图
- 地理定位
- 为鼠标提供的拖放API
- webworker
- (重点)Storage
- (重点)Websocket
HTML语义化是什么?
语义化是指根据内容的结构化(内容语义化),选择合适的标签(代码语义化),便于开发者阅读和写出更优雅的代码的同时,让浏览器的爬虫和机器很好的解析。
为什么要语义化?
- 有利于SEO,有助于爬虫抓取更多的有效信息,爬虫是依赖于标签来确定上下文和各个关键字的权重。
- 语义化的HTML在没有CSS的情况下也能呈现较好的内容结构与代码结构
- 方便其他设备的解析
- 便于团队开发和维护
1、<section></section>
定义文档中的主体部分的节、段。
2、<article></article>
一个特殊的section标签,比section有更明确的语义。定义来自外部的一个独立的、完整的内容块,例如什么论坛的文章,博客的文本。。。
3、<aside></aside>
用来装载页面中非正文的内容,独立于其他模块。例如广告、成组的链接、侧边栏。。。
4、<header></header>
定义文档、页面的页眉。通常是一些引导和导航信息,不局限于整个页面头部,也可以用在内容里。
5、<footer></footer>
定义了文档、页面的页脚,和header类似。
6、<nav></nav>
定义了一个链接组组成的导航部分,其中的链接可以链接到其他网页或者当前页面的其他部分。
7、<hgroup></hgroup>
用于对网页或区段(section)的标题元素(h1~h6)进行组合。
8、<figure></figure>
用于对元素进行组合。
9、<figcaption></figcaption>
为figure元素加标题。一般放在figure第一个子元素或者最后一个。
10、<details></details>
定义元素的细节,用户可以点击查看或者隐藏。
11、<summary></summary>
和details连用,用来包含details的标题。
12、<canvas></canvas>
用来进行canvas绘图。
13、<video></video>
定义视频。
14、<audio></audio>
定义音频。
15、<embed></embed>
定义嵌入网页的内容。比如插件。
16、<source></source>
该标签为媒介元素(比如video、audio)定义媒介元素。
17、<datalist id=‘dl‘></datalist>
定义可选数据的列表,与input配合使用(<input list=‘dl‘>)可制作输入值的下拉列表。
18、<mark></mark>
在视觉上向用户展现出那些想要突出的文字。比如搜索结果中向用户高亮显示搜索关键词。
19、<meter [min/max/low/high/optimum/value]></meter>
度量衡,用红黄绿表示出一个数值所在范围。
20、<output></output>
定义不同类型的输出,样式与span无异。
21、<progress></progress>
进度条,运行中的进度。
22、<time></time>
定义日期或者时间。
23、<keygen></keygen>
定义加密内容。
24、<command></command>
定义命令行为。
原文地址:https://www.cnblogs.com/Billypanda/p/8847720.html