HTML5新增标签

参考HTML5标签列表

 

HTML5新增标签：

<template>:通过JavaScript运行时实例化内容的容器。通过其content属性判断浏览器是否支持该属性：

if ('content' in document.createElement('template')) {}
<section>:定义文文档中一个章节

<nav>:用于定义包含导航链接的标签

<article>:元素表示文档、页面、应用或网站中的独立结构，其意在成为可独立分配的或可复用的结构，如在发布中，它可能是论坛帖子、杂志或新闻文章、博客、用户提交的评论、交互式组件，或者其他独立的内容项目。

<aside> 元素表示一个和其余页面内容几乎无关的部分，被认为是独立于该内容的一部分并且可以被单独的拆分出来而不会使整体受影响

<header>:元素表示一组引导性的帮助，可能包含标题元素，也可以包含其他元素，像logo、分节头部、搜索表单等。

<footer>:元素表示最近一个章节内容或者根节点（sectioning root ）元素的页脚。一个页脚通常包含该章节作者、版权数据或者与文档相关的链接等信息。

<main>:定义文中主要或重要的内容

<figure>:代表一个和文档相关的图例

<figcaption>:代表一个图例的说明；是<figure>的子元素；

<data>、<time>:与机器可读相关。目前大部分浏览器都不支持。

<mark>:代表被高亮的文本

<ruby>、<rt>代表读音注释、<rp>代表括号:定义东亚文字的标签

<ruby>
明日 <rp>(</rp><rt>Ashita</rt><rp>)</rp>
</ruby>
<bdi>:(双向隔离元素) 会隔离可能以不同方向进行格式化的外部文本。只支持Chrome和Firefox

<wbr>: 一个文本中的位置，其中浏览器可以选择来换行，虽然它的换行规则可能不会在这里换行。

 <embed>、<video>、<audio>、<source>:source为video、audio指定媒体源

<video controls>
<source src="foo.webm" type="video/webm">
<source src="foo.ogg" type="video/ogg">
<source src="foo.mov" type="video/quicktime">
I'm sorry; your browser doesn't support HTML5 video.
</video>
<track>：用于指定<video>、<audio>的文本轨道（字幕）

<canvas>:可被用来通过脚本（通常是JavaScript）绘制图形；代表位图区域，用脚本实时呈现图像。

<svg>:代表矢量图

<math>:定义一段数学公式

<datalist>：包含0个或多个子元素option，为其它控件提供可选值

<label>Choose a browser from this list:
<input list="browsers" name="myBrowser" /></label>
<datalist id="browsers">
<option value="Chrome">
<option value="Firefox">
<option value="Internet Explorer">
<option value="Opera">
<option value="Safari">
</datalist>
<keygen>：已经从web标准中移除

<output>：代表计算结果

<progress>:代表进度条

<meter>:代表滑动条

交互标签：

<details>代表用户可以点击的小控件代表菜单

<summary>代表<details>的标题或综述

<menuitem>代表用户可以点击的菜单项，其父元素是<menu>

<menu> 代表菜单

 
————————————————
版权声明：本文为CSDN博主「Xaire」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/u012183426/article/details/84571228