2.9 KiB
2.9 KiB
title, localeTitle
| title | localeTitle |
|---|---|
| Semantic HTML Elements | 语义HTML元素 |
语义HTML元素
<em>元素将文本标记为在其周围的文本上方强调。通常，浏览器以_斜体显示_ ，但您可以使用CSS添加其他样式。
语义HTML元素为浏览器，开发人员和站点用户提供了意义。与<div>或<span>等元素相比， <header>和<footer>等语义元素更清楚地解释了网站每个部分的用途。
为什么要使用语义元素？
开发人员使用语义元素来增强以下内容：
- 辅助功能：帮助辅助技术读取和解释您的网页
- 可搜索性：帮助计算机理解您的内容
- 国际化：世界上只有13％的人是英语母语人士
- 互操作性：帮助其他程序员了解您的网页结构1
有用的语义元素
<header>定义文档或节的标题<footer>定义文档或节的页脚<nav>定义文档中的导航链接<main>定义文档的主要内容<section>定义了文档中的一个部分 - 规范将其定义为“内容的主题分组，通常带有标题”，因此您可以将其视为一个章节<article>定义了文档中的一篇文章<aside>定义除页面内容之外的内容<address>定义文档或文章的作者/所有者的联系信息<figure>定义自包含的内容，如插图，图表，照片，代码块等2
鲜为人知的语义元素
<bdi>定义了一段文本，其格式可能与其他文本的方向不同（例如，希伯来语中的引文或其他英文文章中的阿拉伯语）<details>定义了人们可以查看或隐藏的其他详细信息（如工具提示）<dialog>定义一个对话框或窗口<figcaption>定义了字幕要<figure><mark>定义标记或突出显示的文本<menuitem>定义用户可以从弹出菜单中选择的命令/菜单项<meter>定义已知范围内的标量测量（仪表）<progress>定义任务的进度<rp>定义在不支持ruby注释的浏览器中显示的内容<rt>定义字符的解释/发音（东亚排版）<ruby>定义ruby注释（用于东亚排版）<summary>定义<details>元素的可见标题<time>定义日期/时间<wbr>定义了一个可能的换行符2
来源
- 李，米歇尔。 “HTML5语义概述。” CodePen 。 2016年2月16日。访问时间：2017年10月24日
- Bidaux，Vincent。 “HTML5语义元素和Webflow：必不可少的指南。” Webflow 。 2016年12月16日。访问时间：2017年10月24日
更多信息：
有关更多信息：https：//codepen.io/mi-lee/post/an-overview-of-html5-semantics
请参阅MDN Web Docs文章 。