HTML5 语义元素

您所在的位置:网站首页 html五个块级元素 HTML5 语义元素

HTML5 语义元素

2024-07-11 07:03| 来源: 网络整理| 查看: 265

w3school 在线教程 HTML 系列教程 浏览器脚本 服务器脚本 编程教程 XML 系列教程 建站手册 参考手册 HTML 基础教程 HTML 教程 HTML 简介 HTML 编辑器 HTML 基础 HTML 元素 HTML 属性 HTML 标题 HTML 段落 HTML 样式 HTML 格式化 HTML 引用 HTML 注释 HTML 颜色 HTML 颜色名 HTML CSS HTML 链接 HTML 图像 HTML 表格 HTML 列表 HTML 块 HTML 类 HTML Id HTML 内联框架 HTML JavaScript HTML 路径 HTML 头部 HTML 布局 HTML 响应式设计 HTML 计算机代码 HTML5 语义 HTML5 代码约定 HTML 实体 HTML 符号 HTML 表情符号 HTML 字符集 HTML URL HTML 框架 HTML 背景 HTML URL 编码 HTML Web 服务器 HTML 文档类型 HTML 速查手册 HTML XHTML XHTML 简介 XHTML 元素 XHTML 属性 HTML 表单 HTML 表单 HTML 表单属性 HTML 表单元素 HTML 输入类型 HTML 输入属性 HTML Input 表单属性 HTML 图形 HTML5 画布 HTML5 SVG HTML5 画布 vs SVG HTML 媒体 HTML 媒体 HTML 对象 HTML 音频 HTML 视频 HTML YouTube HTML5 HTML5 简介 HTML5 支持 HTML5 元素 HTML5 迁移 HTML API HTML5 地理定位 HTML5 拖放 HTML5 Web 存储 HTML5 应用缓存 HTML5 Web Workers HTML5 SSE 实例/测验/总结 HTML 实例 HTML 测验 HTML 总结 HTML 参考手册 HTML 元素(字母排序) HTML 元素(功能排序) HTML 浏览器支持 HTML 全局属性 HTML 事件 HTML 颜色名 HTML 画布 HTML 视频/音频 HTML 字符集 HTML 文档类型 HTML URL 编码 HTML 语言代码 HTML 国家代码 HTTP 消息 HTTP 方法 键盘快捷键 HTML5 语义元素 HTML 计算机代码 HTML5 代码约定

语义学(源自古希腊)可定义为对语言意义的研究。

语义元素是拥有语义的元素。

什么是语义元素?

语义元素清楚地向浏览器和开发者描述其意义。

非语义元素的例子: 和 - 无法提供关于其内容的信息。

语义元素的例子:、 以及 - 清晰地定义其内容。

浏览器支持 Yes Yes Yes Yes Yes

所有现代浏览器均支持 HTML5 语义元素。

此外,您可以“帮助”老式浏览器处理“未知元素”。

在 HTML5 浏览器支持这一章学习更多知识。

HTML5 中新的语义元素

许多网站包含了指示导航、页眉以及页脚的 HTML 代码,例如这些: 。

HTML5 提供了定义页面不同部分的新语义元素:

HTML5 语义元素 HTML5 元素

元素定义文档中的节。

根据 W3C 的 HTML 文献:“节(section)是有主题的内容组,通常具有标题”。

可以将网站首页划分为简介、内容、联系信息等节。

实例 WWF

The World Wide Fund for Nature (WWF) is....

亲自试一试

HTML5 元素

元素规定独立的自包含内容。

文档有其自身的意义,并且可以独立于网站其他内容进行阅读。

元素的应用场景:

论坛 博客 新闻 实例 What Does WWF Do?

WWF's mission is to stop the degradation of our planet's natural environment, and build a future in which humans live in harmony with nature.

亲自试一试

嵌套语义元素

在 HTML5 标准中, 元素定义完整的相关元素自包含块。

元素被定义为相关元素块。

我们能够使用该定义来决定如何嵌套元素吗?不,我们不能!

在因特网上,您会发现 元素包含 元素的 HTML 页面,还有 元素包含 元素的页面。

您还会发现 元素包含 元素,同时 元素包含 元素。

HTML5 元素

元素为文档或节规定页眉。

元素应该被用作介绍性内容的容器。

一个文档中可以有多个 元素。

下例为一篇文章定义了页眉:

实例 What Does WWF Do?

WWF's mission:

WWF's mission is to stop the degradation of our planet's natural environment, and build a future in which humans live in harmony with nature.

亲自试一试

HTML5 元素

元素为文档或节规定页脚。

元素应该提供有关其包含元素的信息。

页脚通常包含文档的作者、版权信息、使用条款链接、联系信息等等。

您可以在一个文档中使用多个 元素。

实例

Posted by: Hege Refsnes

Contact information: [email protected].

亲自试一试

HTML5 元素

元素定义导航链接集合。

元素旨在定义大型的导航链接块。不过,并非文档中所有链接都应该位于 元素中!

实例 HTML | CSS | JavaScript | jQuery

亲自试一试

HTML5 元素

元素页面主内容之外的某些内容(比如侧栏)。

aside 内容应该与周围内容相关。

实例

My family and I visited The Epcot center this summer.

Epcot Center

The Epcot Center is a theme park in Disney World, Florida.

亲自试一试

HTML5 和 元素

在书籍和报纸中,与图片搭配的标题很常见。

标题(caption)的作用是为图片添加可见的解释。

通过 HTML5,图片和标题能够被组合在 元素中:

实例 Fig1. - The Pulpit Pock, Norway.

亲自试一试

元素定义图像, 元素定义标题。

为何使用 HTML5 元素?

如果使用 HTML4 的话,开发者会使用他们喜爱的属性名来设置页面元素的样式:

header, top, bottom, footer, menu, navigation, main, container, content, article, sidebar, topnav, ...

如此,浏览器便无法识别正确的网页内容。

而通过 HTML5 元素,比如: ,此问题迎刃而解。

根据 W3C,语义网:

“允许跨应用程序、企业和团体对数据进行分享和重用。” HTML5 中的语义元素

下面列出了以字母顺序排列的 HTML5 新语义元素。

这些链接指向完整的 HTML 参考手册。

标签 描述 定义文章。 定义页面内容以外的内容。 定义用户能够查看或隐藏的额外细节。 定义 元素的标题。 规定自包含内容,比如图示、图表、照片、代码清单等。 定义文档或节的页脚。 规定文档或节的页眉。 规定文档的主内容。 定义重要的或强调的文本。 定义导航链接。 定义文档中的节。 定义 元素的可见标题。 定义日期/时间。 HTML 计算机代码 HTML5 代码约定 HTML 参考手册 HTML 实例 HTML 测验

W3School 简体中文版提供的内容仅用于培训和测试,不保证内容的正确性。通过使用本站内容随之而来的风险与本站无关。版权所有,保留一切权利。

关于 W3School 帮助 W3School 使用条款 隐私条款 技术支持:赢科 蒙ICP备06004630号



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3