大成 发表于 2025-6-9 09:04:02

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 已有标签,非新增。

页: [1]
查看完整版本: html5新增标签