html5新增标签

大成

HTML5 引入了多种新标签，极大地增强了网页的语义化、多媒体支持及交互功能。以下是主要的新增标签分类归纳：

🏗️ 一、语义化结构标签（用于优化文档结构）
<header>‌：定义文档或章节的头部区域，通常包含标题、Logo、导航等。
<nav>‌：标记导航链接的集合，如主导航菜单。
<footer>‌：定义文档或章节的页脚，包含版权信息、联系方式等。
<article>‌：表示独立的内容区块（如新闻文章、博客帖子）。
<section>‌：定义文档中的专题区域或逻辑分组（如章节）。
<aside>‌：标注与主内容相关的辅助信息（如侧边栏）。
<main>‌：标识页面的核心内容区域。
<figure> 与 <figcaption>‌：组合表示独立流内容（如图片+标题），<figcaption>为其定义标题。
<details> 与 <summary>‌：创建可折叠的内容区块，<summary>定义标题。
📺 二、媒体标签
<video>‌：嵌入视频内容，支持格式如 MP4、WebM。
<audio>‌：嵌入音频内容，支持 MP3、WAV 等格式。
<embed>‌：通用容器，嵌入外部应用或插件内容（如 Flash）。
📝 三、表单增强标签
<datalist>‌：为 <input> 提供预定义选项列表（配合 list 属性）。
<output>‌：显示计算或脚本输出的结果。
新增 input 类型‌：
email（邮箱）、url（网址）、number（数字）、range（滑块）
date/month/week/time（日期选择器）、color（颜色选择器）、search（搜索框）等。
🛠️ 四、其他功能标签
<mark>‌：高亮标记文本内容。
<progress>‌：显示任务进度条（如文件上传）。
<time>‌：定义机器可读的时间或日期。
<ruby> 与 <rt>‌：为文字添加注音（如日语假名）。
<wbr>‌：指示可选的换行位置（软换行）。

⚠️ 注意：部分标签如 <hr> 在 HTML5 中被重新定义语义，但属于 HTML4 已有标签，非新增。