HTML
动态标准 — 最后更新于 2024年9月12日
动态标准 — 最后更新于 2024年9月12日
a 元素em 元素strong 元素small 元素s 元素cite 元素q 元素dfn 元素abbr 元素ruby 元素rt 元素rp 元素data 元素time 元素code 元素var 元素samp 元素kbd 元素sub 和 sup 元素i 元素b 元素u 元素mark 元素bdi 元素bdo 元素span 元素br 元素wbr 元素a 元素所有当前引擎都支持。
所有当前引擎都支持。
href 属性：交互式内容。a 元素后代或指定了 tabindex 属性的后代。href — 超链接的地址target — 可导航的，用于 超链接 导航download — 是否下载资源而不是导航到它，以及如果是，则为其文件名ping — 要 ping 的 URLrel — 包含 超链接 的文档位置与目标资源之间的关系hreflang — 链接资源的语言type — 引用的资源类型的提示referrerpolicy — 由元素发起的 获取 的 引用者策略href 属性：供作者使用；供实施者使用。[Exposed =Window ]
interface HTMLAnchorElement : HTMLElement {
[HTMLConstructor ] constructor ();
[CEReactions ] attribute DOMString target ;
[CEReactions ] attribute DOMString download ;
[CEReactions ] attribute USVString ping ;
[CEReactions ] attribute DOMString rel ;
[SameObject , PutForwards =value ] readonly attribute DOMTokenList relList ;
[CEReactions ] attribute DOMString hreflang ;
[CEReactions ] attribute DOMString type ;
[CEReactions ] attribute DOMString text ;
[CEReactions ] attribute DOMString referrerPolicy ;
// also has obsolete members
};
HTMLAnchorElement includes HTMLHyperlinkElementUtils ;如果 a 元素具有 href 属性，则它 表示 一个由其内容标记的 超链接（超文本锚点）。
如果 a 元素没有 href 属性，则该元素 表示 一个占位符，如果相关，则可能在其中放置链接，仅由元素的内容组成。
如果 href 属性不存在，则必须省略 target、download、ping、rel、hreflang、type 和 referrerpolicy 属性。
如果在 a 元素上指定了 itemprop 属性，则还必须指定 href 属性。
如果某个站点在每个页面上都使用一致的导航工具栏，则通常链接到页面本身的链接可以使用 a 元素进行标记
< nav >
< ul >
< li > < a href = "/" > Home</ a > </ li >
< li > < a href = "/news" > News</ a > </ li >
< li > < a > Examples</ a > </ li >
< li > < a href = "/legal" > Legal</ a > </ li >
</ ul >
</ nav > href、target、download、ping 和 referrerpolicy 属性会影响用户 跟随超链接 或 下载使用 a 元素创建的超链接 时发生的情况。 rel、hreflang 和 type 属性可用于在用户跟随链接之前向用户指示目标资源的可能性质。
a.text与 textContent 相同。
所有当前引擎都支持。
所有当前引擎都支持。
IDL 属性 download、ping、target、rel、hreflang 和 type 必须 反映 同名的相应内容属性。
所有当前引擎都支持。
IDL 属性 relList 必须 反映 rel 内容属性。
HTMLAnchorElement/referrerPolicy
所有当前引擎都支持。
IDL 属性 referrerPolicy 必须 反映 referrerpolicy 内容属性，仅限于已知值。
text 属性的 getter 必须返回此元素的 后代文本内容。
text 属性的 setter 必须 使用给定值替换此元素中的所有字符串。
a 元素可以包裹在整个段落、列表、表格等周围，甚至整个部分，只要内部没有交互式内容（例如，按钮或其他链接）。此示例显示了如何将其用于将整个广告块变成链接
< aside class = "advertising" >
< h1 > Advertising</ h1 >
< a href = "https://ad.example.com/?adid=1929&pubid=1422" >
< section >
< h1 > Mellblomatic 9000!</ h1 >
< p > Turn all your widgets into mellbloms!</ p >
< p > Only $9.99 plus shipping and handling.</ p >
</ section >
</ a >
< a href = "https://ad.example.com/?adid=375&pubid=1422" >
< section >
< h1 > The Mellblom Browser</ h1 >
< p > Web browsing at the speed of light.</ p >
< p > No other browser goes faster!</ p >
</ section >
</ a >
</ aside > 以下示例显示了如何使用一些脚本有效地将职位列表表格中的一整行变成超链接
< table >
< tr >
< th > Position
< th > Team
< th > Location
< tr >
< td >< a href = "/jobs/manager" > Manager</ a >
< td > Remotees
< td > Remote
< tr >
< td >< a href = "/jobs/director" > Director</ a >
< td > Remotees
< td > Remote
< tr >
< td >< a href = "/jobs/astronaut" > Astronaut</ a >
< td > Architecture
< td > Remote
</ table >
< script >
document. querySelector( "table" ). onclick = ({ target }) => {
if ( target. parentElement. localName === "tr" ) {
const link = target. parentElement. querySelector( "a" );
if ( link) {
link. click();
}
}
}
</ script > em 元素所有当前引擎都支持。
HTMLElement。特定内容的强调级别由其祖先em元素的数量决定。
强调的放置会改变句子的含义。因此，该元素构成了内容的组成部分。这种强调的使用方式取决于具体的语言。
以下示例展示了如何通过改变强调来改变含义。首先，一个没有强调的一般性陈述
< p > Cats are cute animals.</ p > 通过强调第一个词，该陈述暗示正在讨论的动物类型存在疑问（也许有人断言狗很可爱）
< p >< em > Cats</ em > are cute animals.</ p > 将强调转移到动词上，则突出整个句子的真实性存在疑问（也许有人说猫不可爱）
< p > Cats < em > are</ em > cute animals.</ p > 通过将其转移到形容词上，重新强调了猫的确切性质（也许有人暗示猫是刻薄的动物）
< p > Cats are < em > cute</ em > animals.</ p > 同样，如果有人断言猫是蔬菜，那么纠正此错误的人可能会强调最后一个词
< p > Cats are cute < em > animals</ em > .</ p > 通过强调整个句子，可以清楚地表明说话者正在努力传达观点。这种强调通常也会影响标点符号，因此这里有感叹号。
< p >< em > Cats are cute animals!</ em ></ p > 愤怒与强调可爱相结合可能导致如下标记
< p >< em > Cats are < em > cute</ em > animals!</ em ></ p > strong 元素所有当前引擎都支持。
HTMLElement。重要性：strong 元素可用于标题、字幕或段落中，以区分真正重要的部分与其他可能更详细、更轻松或仅仅是样板的部分。（这与标记子标题不同，子标题应使用hgroup 元素。）
例如，上一段的第一词用strong 标记，以将其与段落其余部分中更详细的文本区分开来。
严肃性：strong 元素可用于标记警告或注意事项。
紧急性：strong 元素可用于表示用户需要比文档其他部分更早看到的內容。
内容的相关重要级别由其祖先strong元素的数量决定；每个strong 元素都会提高其内容的重要性。
使用strong 元素更改文本的重要性不会改变句子的含义。
这里，“章节”一词和实际的章节编号仅仅是样板，而章节的实际名称用strong 标记
< h1 > Chapter 1: < strong > The Praxis</ strong ></ h1 > 在以下示例中，标题中的图表名称用strong 标记，以将其与样板文本（之前）和描述（之后）区分开来
< figcaption > Figure 1. < strong > Ant colony dynamics</ strong > . The ants in this colony are
affected by the heat source (upper left) and the food source (lower right).</ figcaption > 在此示例中，标题实际上是“花、蜜蜂和蜂蜜”，但作者在标题中添加了一个轻松的补充。因此，strong 元素用于标记第一部分，以将其与后一部分区分开来。
< h1 >< strong > Flowers, Bees, and Honey</ strong > and other things I don't understand</ h1 > 这是一个游戏中的警告示例，各部分根据其重要性进行标记
< p >< strong > Warning.</ strong > This dungeon is dangerous.
< strong > Avoid the ducks.</ strong > Take any gold you find.
< strong >< strong > Do not take any of the diamonds</ strong > ,
they are explosive and < strong > will destroy anything within
ten meters.</ strong ></ strong > You have been warned.</ p > 在此示例中，strong 元素用于表示用户需要首先阅读的文本部分。
< p > Welcome to Remy, the reminder system.</ p >
< p > Your tasks for today:</ p >
< ul >
< li >< p >< strong > Turn off the oven.</ strong ></ p ></ li >
< li >< p > Put out the trash.</ p ></ li >
< li >< p > Do the laundry.</ p ></ li >
</ ul > small 元素所有当前引擎都支持。
HTMLElement。小字通常包含免责声明、警告、法律限制或版权信息。小字有时也用于署名或满足许可要求。
small 元素不会“弱化”或降低em 元素强调的文本或strong 元素标记为重要的文本的重要性。要将文本标记为未强调或不重要，只需不要分别用em 或strong 元素进行标记。
small 元素不应用于扩展文本跨度，例如多个段落、列表或文本部分。它仅用于短文本运行。例如，列出使用条款的页面文本不适合使用small 元素：在这种情况下，文本不是旁注，而是页面的主要内容。
small 元素不得用于子标题；为此，请使用hgroup 元素。
在此示例中，small 元素用于指示酒店房间价格不含增值税
< dl >
< dt > Single room
< dd > 199 € < small > breakfast included, VAT not included</ small >
< dt > Double room
< dd > 239 € < small > breakfast included, VAT not included</ small >
</ dl > 在此第二个示例中，small 元素用于文章中的旁注。
< p > Example Corp today announced record profits for the
second quarter < small > (Full Disclosure: Foo News is a subsidiary of
Example Corp)</ small > , leading to speculation about a third quarter
merger with Demo Group.</ p > 这与侧边栏不同，侧边栏可能有多个段落长，并且与文本的主流程分离。在以下示例中，我们看到了同一篇文章中的一个侧边栏。此侧边栏也包含小字，指示侧边栏中信息的来源。
< aside >
< h1 > Example Corp</ h1 >
< p > This company mostly creates small software and Web
sites.</ p >
< p > The Example Corp company mission is "To provide entertainment
and news on a sample basis".</ p >
< p >< small > Information obtained from < a
href = "https://example.com/about.html" > example.com</ a > home
page.</ small ></ p >
</ aside > 在最后一个示例中，small 元素被标记为重要的小字。
< p >< strong >< small > Continued use of this service will result in a kiss.</ small ></ strong ></ p > s 元素所有当前引擎都支持。
HTMLElement。当指示文档编辑时，s 元素不适用；要将文本跨度标记为已从文档中删除，请使用del 元素。
在此示例中，建议零售价已标记为不再相关，因为相关产品有新的促销价。
< p > Buy our Iced Tea and Lemonade!</ p >
< p >< s > Recommended retail price: $3.99 per bottle</ s ></ p >
< p >< strong > Now selling for just $2.99 a bottle!</ strong ></ p > cite 元素所有当前引擎都支持。
HTMLElement。cite 元素表示作品的标题（例如，书籍、论文、文章、诗歌、乐谱、歌曲、剧本、电影、电视剧、游戏、雕塑、绘画、戏剧作品、戏剧、歌剧、音乐剧、展览、法律案例报告、计算机程序等）。这可以是被引用或详细参考的作品（即引用），也可以仅仅是被顺便提及的作品。
一个人的姓名不是作品的标题——即使人们称那个人为作品——因此该元素不得用于标记人名。（在某些情况下，b 元素可能适合用于人名；例如，在八卦文章中，名人的姓名是渲染成不同样式的关键词，以吸引人们的注意。在其他情况下，如果确实需要元素，则可以使用span 元素。）
下一个示例展示了cite 元素的典型用法
< p > My favorite book is < cite > The Reality Dysfunction</ cite > by
Peter F. Hamilton. My favorite comic is < cite > Pearls Before
Swine</ cite > by Stephan Pastis. My favorite track is < cite > Jive
Samba</ cite > by the Cannonball Adderley Sextet.</ p > 这是正确的用法
< p > According to the Wikipedia article < cite > HTML</ cite > , as it
stood in mid-February 2008, leaving attribute values unquoted is
unsafe. This is obviously an over-simplification.</ p > 但是，以下是错误的用法，因为这里的cite 元素包含的内容远远超过作品的标题
<!-- do not copy this example, it is an example of bad usage! -->
< p > According to < cite > the Wikipedia article on HTML</ cite > , as it
stood in mid-February 2008, leaving attribute values unquoted is
unsafe. This is obviously an over-simplification.</ p > cite 元素是任何参考文献中引用的关键部分，但它仅用于标记标题
< p >< cite > Universal Declaration of Human Rights</ cite > , United Nations,
December 1948. Adopted by General Assembly resolution 217 A (III).</ p > 引用不是引语（引语应使用q 元素）。
这是错误的用法，因为cite 不用于引语
< p >< cite > This is wrong!</ cite > , said Ian.</ p > 这也是错误的用法，因为人不是作品
< p >< q > This is still wrong!</ q > , said < cite > Ian</ cite > .</ p > 正确的用法不使用cite 元素
< p >< q > This is correct</ q > , said Ian.</ p > 如上所述，b 元素可能与在某些类型的文档中将名称标记为关键词相关
< p > And then < b > Ian</ b > said < q > this might be right, in a
gossip column, maybe!</ q > .</ p > q 元素所有当前引擎都支持。
cite — 链接到引文的来源或有关编辑的更多信息HTMLQuoteElement。引用内容的标点符号（如引号）不得出现在 q 元素的前面、后面或内部；它们将由用户代理插入渲染中。
q 元素内部的内容必须引用自另一个来源，如果该来源有地址，则可以在 cite 属性中引用。来源可以是虚构的，例如在引用小说或剧本中的角色时。
如果存在 cite 属性，则它必须是 可能被空格包围的有效 URL。为了获取相应的引用链接，必须相对于元素的 节点文档 解析 属性的值。用户代理可以允许用户访问此类引用链接，但它们主要用于私用（例如，由服务器端脚本收集有关站点对引用的使用情况的统计信息），而不是供读者使用。
q 元素不得用于代替不表示引用的引号；例如，使用 q 元素来标记讽刺语句是不合适的。
使用 q 元素来标记引号是完全可选的；在没有 q 元素的情况下使用显式引号标点符号也是正确的。
这是一个 q 元素用法的简单示例。
< p > The man said < q > Things that are impossible just take
longer</ q > . I disagreed with him.</ p > 这是一个同时包含 q 元素中的显式引用链接和外部显式引用的示例。
< p > The W3C page < cite > About W3C</ cite > says the W3C's
mission is < q cite = "https://www.w3.org/Consortium/" > To lead the
World Wide Web to its full potential by developing protocols and
guidelines that ensure long-term growth for the Web</ q > . I
disagree with this mission.</ p > 在以下示例中，引文本身包含一个引文。
< p > In < cite > Example One</ cite > , he writes < q > The man
said < q > Things that are impossible just take longer</ q > . I
disagreed with him</ q > . Well, I disagree even more!</ p > 在以下示例中，使用引号代替 q 元素。
< p > His best argument was ❝I disagree❞, which
I thought was laughable.</ p > 在以下示例中，没有引号——引号用于命名一个词。在这种情况下使用 q 元素是不合适的。
< p > The word "ineffable" could have been used to describe the disaster
resulting from the campaign's mismanagement.</ p > dfn 元素所有当前引擎都支持。
dfn 元素后代。title 属性 在此元素上具有特殊语义：缩写的完整术语或扩展。HTMLElement。dfn 元素 表示 术语的定义实例。dfn 元素的最近祖先的 段落、描述列表组 或 节 也必须包含 dfn 元素给出的 术语 的定义。
定义术语：如果 dfn 元素具有 title 属性，则该属性的精确值为正在定义的术语。否则，如果它恰好包含一个元素子节点且没有子 Text 节点，并且该子元素是具有 title 属性的 abbr 元素，则该属性的精确值为正在定义的术语。否则，它是 dfn 元素的 后代文本内容，它给出正在定义的术语。
如果 title 元素的 dfn 属性存在，则它必须仅包含正在定义的术语。
链接到 dfn 元素的 a 元素表示 dfn 元素定义的术语的一个实例。
在以下片段中，术语“车库门开启器”首先在第一段中定义，然后在第二段中使用。在这两种情况下，实际显示的是它的缩写。
< p > The < dfn >< abbr title = "Garage Door Opener" > GDO</ abbr ></ dfn >
is a device that allows off-world teams to open the iris.</ p >
<!-- ... later in the document: -->
< p > Teal'c activated his < abbr title = "Garage Door Opener" > GDO</ abbr >
and so Hammond ordered the iris to be opened.</ p > < p > The < dfn id = gdo >< abbr title = "Garage Door Opener" > GDO</ abbr ></ dfn >
is a device that allows off-world teams to open the iris.</ p >
<!-- ... later in the document: -->
< p > Teal'c activated his < a href = #gdo > < abbr title = "Garage Door Opener" > GDO</ abbr > </ a >
and so Hammond ordered the iris to be opened.</ p > abbr 元素所有当前引擎都支持。
title 属性 在此元素上具有特殊语义：缩写的完整术语或扩展。HTMLElement。abbr 元素 表示 缩写或首字母缩写词，可以选择提供其扩展。可以使用 title 属性提供缩写的扩展。如果指定了属性，则它必须包含缩写的扩展，仅此而已。
下面的段落包含一个用 abbr 元素标记的缩写。此段落 定义了术语“Web 超文本应用技术工作组”。
< p > The < dfn id = whatwg >< abbr
title = "Web Hypertext Application Technology Working Group" > WHATWG</ abbr ></ dfn >
is a loose unofficial collaboration of web browser manufacturers and
interested parties who wish to develop new technologies designed to
allow authors to write and deploy Applications over the World Wide
Web.</ p > 另一种写法是
< p > The < dfn id = whatwg > Web Hypertext Application Technology
Working Group</ dfn > (< abbr
title = "Web Hypertext Application Technology Working Group" > WHATWG</ abbr > )
is a loose unofficial collaboration of web browser manufacturers and
interested parties who wish to develop new technologies designed to
allow authors to write and deploy Applications over the World Wide
Web.</ p > 此段落有两个缩写。请注意，只有一个被定义；另一个没有关联的扩展，没有使用 abbr 元素。
< p > The
< abbr title = "Web Hypertext Application Technology Working Group" > WHATWG</ abbr >
started working on HTML5 in 2004.</ p > 此段落将缩写链接到其定义。
< p > The < a href = "#whatwg" >< abbr
title = "Web Hypertext Application Technology Working Group" > WHATWG</ abbr ></ a >
community does not have much representation from Asia.</ p > 此段落标记了一个缩写，但没有给出扩展，可能是为了提供应用于缩写的样式的钩子（例如，小型大写字母）。
< p > Philip` and Dashiva both denied that they were going to
get the issue counts from past revisions of the specification to
backfill the < abbr > WHATWG</ abbr > issue graph.</ p > 如果缩写被复数化，则扩展的语法数（复数与单数）必须与元素内容的语法数匹配。
这里复数在元素之外，因此扩展为单数。
< p > Two < abbr title = "Working Group" > WG</ abbr > s worked on
this specification: the < abbr > WHATWG</ abbr > and the
< abbr > HTMLWG</ abbr > .</ p > 这里复数在元素内部，因此扩展为复数。
< p > Two < abbr title = "Working Groups" > WGs</ abbr > worked on
this specification: the < abbr > WHATWG</ abbr > and the
< abbr > HTMLWG</ abbr > .</ p > 缩写不必使用此元素进行标记。预计在以下情况下会很有用。
title 属性的 abbr 元素是包含内联扩展（例如，在括号中）的替代方案。title 属性的 abbr 元素标记缩写，或者在第一次使用缩写时在文本中内联包含扩展。abbr 元素而不带 title 属性。在 title 属性中提供一次扩展并不一定会导致同一文档中具有相同内容但没有 title 属性的其他 abbr 元素的行为如同具有相同的扩展。每个 abbr 元素都是独立的。
ruby 元素所有当前引擎都支持。
HTMLElement。ruby 元素允许用 ruby 注解标记一个或多个短语内容的跨度。Ruby 注解是与基础文本一起显示的短文本运行，主要用于东亚排版作为发音指南或包含其他注释。在日语中，这种排版形式也称为furigana。
ruby 元素的内容模型由一个或多个以下序列组成。
以下两者之一。
以下两者之一。
ruby 和 rt 元素可用于各种注释，尤其包括（但绝不限于）以下描述的那些注释。有关日语 Ruby 的更多详细信息，以及如何渲染日语 Ruby，请参阅日语文本布局要求。[JLREQ]
在撰写本文时，CSS 尚未提供完全控制 HTML ruby 元素渲染的方法。希望 CSS 能够在适当的时候扩展以支持下面描述的样式。
一个或多个平假名或片假名字符（注音）与每个汉字字符（基础文本）一起放置。这用于提供汉字的读音。
< ruby > B< rt > annotation</ ruby > 这与前面的情况类似：复合词中的每个汉字字符（基础文本）都用平假名或片假名字符（注音）给出其读音。不同之处在于基础文本段形成了一个复合词，而不是彼此分离的。
< ruby > B< rt > annotation</ rt > B< rt > annotation</ ruby > 在这个例子中，再次注意每个注音是如何对应一个基础字符的。在这个例子中，每个复合词（熟语）对应一个 ruby 元素。
这里的渲染预期是每个注音都放置在相应的字元上方（或在垂直文本中放置在旁边），并且注音不会悬挂在任何相邻的字元上。
< ruby > 鬼< rt > き</ rt > 門< rt > もん</ rt ></ ruby > の< ruby > 方< rt > ほう</ rt > 角< rt > がく</ rt ></ ruby > を< ruby > 凝< rt > ぎょう</ rt > 視< rt > し</ rt ></ ruby > する鬼門の方角を凝視する
这在语义上与前面的情况相同（基础复合词中的每个汉字字符都用平假名或片假名字符的注音给出其读音），但渲染更加复杂，是熟语注音渲染。
这与上面复合词单字注音的例子相同。不同的渲染预期是使用不同的样式（例如在 CSS 中）实现的，这里没有显示。
< ruby > 鬼< rt > き</ rt > 門< rt > もん</ rt ></ ruby > の< ruby > 方< rt > ほう</ rt > 角< rt > がく</ rt ></ ruby > を< ruby > 凝< rt > ぎょう</ rt > 視< rt > し</ rt ></ ruby > する注音描述基础文本的含义，而不是（或除了）发音。因此，基础文本和注音都可以是多个字符。
< ruby > BASE< rt > annotation</ ruby > 这里一个复合汉字词用相应的片假名作为注音。
< ruby > 境界面< rt > インターフェース</ ruby > 境界面
这里一个复合汉字词用英语翻译作为注音。
< ruby lang = "ja" > 編集者< rt lang = "en" > editor</ ruby > 編集者
一个对应多个基础字符的发音读法，因为一对一的映射将很困难。（在英语中，“上校”和“中尉”是单词的例子，其中发音到单个字母的直接映射在某些方言中相当不清楚。）
在这个例子中，一种花的名称使用组注音提供了发音读法。
< ruby > 紫陽花< rt > あじさい</ ruby > 紫陽花
有时，上面描述的注音样式会组合使用。
如果这导致两个注音覆盖同一个基础段，则注音可以简单地并排放置。
< ruby > BASE< rt > annotation 1< rt > annotation 2</ ruby > < ruby > B< rt > a< rt > a</ ruby >< ruby > A< rt > a< rt > a</ ruby >< ruby > S< rt > a< rt > a</ ruby >< ruby > E< rt > a< rt > a</ ruby > 在这个人为的例子中，一些符号用英语和法语给出名称。
< ruby >
♥ < rt > Heart < rt lang = fr > Cœur </ rt >
☘ < rt > Shamrock < rt lang = fr > Trèfle </ rt >
✶ < rt > Star < rt lang = fr > Étoile </ rt >
</ ruby > 在以下示例等更复杂的情况下，嵌套的 ruby 元素用于给出内部注音，然后整个 ruby 在“外部”级别给出注音。
< ruby >< ruby > B< rt > a</ rt > A< rt > n</ rt > S< rt > t</ rt > E< rt > n</ rt ></ ruby >< rt > annotation</ ruby > 这里用注音分别给出了发音读法和含义。嵌套的 ruby 元素上的注音为每个基础字符提供了单字注音发音注音，而外部 ruby 元素的子元素 rt 中的注音使用平假名给出了含义。
< ruby >< ruby > 東< rt > とう</ rt > 南< rt > なん</ rt ></ ruby >< rt > たつみ</ rt ></ ruby > の方角東南の方角
这是同一个例子，但含义用英语而不是日语给出。
< ruby >< ruby > 東< rt > とう</ rt > 南< rt > なん</ rt ></ ruby >< rt lang = en > Southeast</ rt ></ ruby > の方角東南の方角
在没有 ruby 元素祖先的 ruby 元素中，内容被分割，段落被分成三类：基础文本段、注音段和忽略段。忽略段不构成文档的语义（它们由一些 元素间空白 和 rp 元素组成，后者用于不支持 ruby 的旧版用户代理）。基础文本段可以重叠（任何一个 DOM 位置最多重叠两个段，并且任何一个段的起始点都早于重叠段的起始点，也必须具有相同或更晚的结束点，并且任何一个段的结束点都晚于重叠段的结束点，也必须具有相同或更早的起始点）。注音段对应于 rt 元素。每个注音段可以与一个基础文本段关联，每个基础文本段可以有多个注音段与之关联。（在符合标准的文档中，每个基础文本段都与至少一个注音段关联，每个注音段都与一个基础文本段关联。）ruby 元素 表示 它包含的基础文本段的并集，以及从这些基础文本段到注音段的映射。段落用 DOM 范围来描述；注音段范围始终只包含一个元素。[DOM]
在任何特定时间，ruby 元素内容的分割和分类都是运行以下算法获得的结果。
令 基础文本段 为一个空的列表，其中包含基础文本段，每个段可能包含一个基础文本子段列表。
令 注音段 为一个空的列表，其中包含注音段，每个段可能与一个基础文本段或子段相关联。
令 根 为正在运行算法的 ruby 元素。
如果 根 有一个 ruby 元素祖先，则跳转到标记为 结束 的步骤。
令 当前父级 为 根。
令 索引 为 0。
令 起始索引 为 null。
令 父级起始索引 为 null。
令 当前基础文本 为 null。
开始模式：如果 索引 大于或等于 当前父级 中子节点的数量，则跳转到标记为 结束模式 的步骤。
将 起始索引 设置为 索引 的值。
基础模式：如果 当前父级 中的第 索引 个节点是 ruby 元素，并且如果 当前父级 与 根 是同一个元素，则 压入一个 ruby 层级，然后跳转到标记为 开始模式 的步骤。
如果 当前父级 中的第 索引 个节点是 rt 或 rp 元素，则 设置当前基础文本，然后跳转到标记为 注音模式 的步骤。
将 索引 加 1。
基础模式后增量：如果 索引 大于或等于 当前父级 中子节点的数量，则跳转到标记为 结束模式 的步骤。
跳转回标记为 基础模式 的步骤。
注音模式：如果 当前父级 中的第 索引 个节点是 rt 元素，则 压入一个 ruby 注音 并跳转到标记为 注音模式增量 的步骤。
如果 当前父级 中的第 索引 个节点是 rp 元素，则跳转到标记为 注音模式增量 的步骤。
如果 当前父级 中的第 索引 个节点不是 Text 节点，或者是一个不是 元素间空白 的 Text 节点，则跳转到标记为 基础模式 的步骤。
注音模式增量：令 前瞻索引 为 索引 加 1。
注音模式空白跳过：如果 前瞻索引 等于 当前父级 中子节点的数量，则跳转到标记为 结束模式 的步骤。
如果 当前父级 中的第 前瞻索引 个节点是 rt 元素或 rp 元素，则将 索引 设置为 前瞻索引 并跳转到标记为 注音模式 的步骤。
如果 当前父级 中的第 前瞻索引 个节点不是 Text 节点，或者是一个不是 元素间空白 的 Text 节点，则跳转到标记为 基础模式 的步骤（不进一步增加 索引，因此到目前为止看到的 元素间空白 成为下一个基础文本段的一部分）。
将 前瞻索引 加 1。
跳转到标记为 注音模式空白跳过 的步骤。
结束模式：如果 当前父级 与 根 不是同一个元素，则 弹出 ruby 层级 并跳转到标记为 基础模式后增量 的步骤。
结束：返回 基础文本段 和 注音段。 ruby 元素中这两个列表的段落未描述的任何内容都隐式地位于 忽略段 中。
当以上步骤说要 设置当前基础文本 时，表示在算法的该点运行以下步骤。
令`文本范围`为一个DOM范围，其`起始位置`为`边界点`（`当前父节点`，`起始索引`），其`结束位置`为`边界点`（`当前父节点`，`索引`）。
令`新文本片段`为由范围`注释范围`描述的基本文本片段。
将`新文本片段`添加到`基本文本片段`中。
令`当前基本文本`为`新文本片段`。
令 起始索引 为 null。
当上述步骤要求`推送一个Ruby级别`时，表示在算法中的该点运行以下步骤。
令`当前父节点`为`当前父节点`中第`索引`个节点。
令 索引 为 0。
将`已保存的起始索引`设置为`起始索引`的值。
令 起始索引 为 null。
当上述步骤要求`弹出Ruby级别`时，表示在算法中的该点运行以下步骤。
令`索引`为`当前父节点`在`根节点`中的位置。
令 当前父级 为 根。
将 索引 加 1。
将`起始索引`设置为`已保存的起始索引`的值。
令`已保存的起始索引`为null。
当上述步骤要求`推送一个Ruby注释`时，表示在算法中的该点运行以下步骤。
令`rt`为`rt元素，它是`当前父节点`的第`索引`个节点。
令`注释范围`为一个DOM范围，其`起始位置`为`边界点`（`当前父节点`，`索引`），其`结束位置`为`边界点`（`当前父节点`，`索引`加一）（即仅包含`rt`）。
令`新注释片段`为由范围`注释范围`描述的注释片段。
如果`当前基本文本`不为null，则将`新注释片段`与`当前基本文本`关联。
将`新注释片段`添加到`注释片段`中。
在本例中，日语文本`漢字`中的每个汉字都用平假名标注了其读音。
...
< ruby > 漢< rt > かん</ rt > 字< rt > じ</ rt ></ ruby >
...这可能呈现为
在本例中，繁体中文文本`漢字`中的每个汉字都用注音符号标注了其读音。
< ruby > 漢< rt > ㄏㄢˋ</ rt > 字< rt > ㄗˋ</ rt ></ ruby > 这可能呈现为
在本例中，简体中文文本`汉字`中的每个汉字都用拼音标注了其读音。
...< ruby > 汉< rt > hàn</ rt > 字< rt > zì</ rt ></ ruby > ...这可能呈现为
在这个更人为构造的例子中，“HTML”的首字母缩写有四个注释：一个用于整个首字母缩写，简要描述了它是什么，一个用于字母“HT”，将其扩展为“超文本”，一个用于字母“M”，将其扩展为“标记”，一个用于字母“L”，将其扩展为“语言”。
< ruby >
< ruby > HT< rt > Hypertext</ rt > M< rt > Markup</ rt > L< rt > Language</ rt ></ ruby >
< rt > An abstract language for describing documents and applications
</ ruby > rt` 元素所有当前引擎都支持。
ruby`元素的子元素。rt`元素紧跟着`rt`或`rp`元素，或者父元素中没有更多内容，则可以省略`rt`元素的`结束标签`。HTMLElement`。`rt`元素标记Ruby注释的Ruby文本组件。当它是`ruby`元素的子元素时，它本身`不表示`任何内容，但`ruby`元素使用它作为确定其`表示`内容的一部分。
不是`ruby`元素子元素的`rt`元素`表示`与其子元素相同的内容。
rp` 元素所有当前引擎都支持。
ruby`元素的子元素，位于`rt`元素的紧前面或紧后面。rp`元素紧跟着`rt`或`rp`元素，或者父元素中没有更多内容，则可以省略`rp`元素的`结束标签`。HTMLElement`。`rp`元素可用于在Ruby注释的Ruby文本组件周围提供括号或其他内容，以便在不支持Ruby注释的用户代理中显示。
作为`ruby`元素子元素的`rp`元素`不表示`任何内容。父元素不是`ruby`元素的`rp`元素`表示`其子元素。
上面的例子，其中文本`漢字`中的每个汉字都用其发音标注，可以扩展为使用`rp`，以便在旧版用户代理中，读音在括号中。
...
< ruby > 漢< rp > （</ rp >< rt > かん</ rt >< rp > ）</ rp > 字< rp > （</ rp >< rt > じ</ rt >< rp > ）</ rp ></ ruby >
...在符合标准的用户代理中，渲染效果与上面相同，但在不支持Ruby的用户代理中，渲染效果为
... 漢（かん）字（じ）...
当一个片段有多个注释时，也可以在注释之间放置`rp`元素。以下是前面一个人为构造的例子的另一个副本，显示了一些用英语和法语给出的名称的符号，但这次还使用了`rp`元素。
< ruby >
♥< rp > : </ rp >< rt > Heart</ rt >< rp > , </ rp >< rt lang = fr > Cœur</ rt >< rp > .</ rp >
☘< rp > : </ rp >< rt > Shamrock</ rt >< rp > , </ rp >< rt lang = fr > Trèfle</ rt >< rp > .</ rp >
✶< rp > : </ rp >< rt > Star</ rt >< rp > , </ rp >< rt lang = fr > Étoile</ rt >< rp > .</ rp >
</ ruby > 这将使示例在非Ruby功能的用户代理中呈现如下。
♥: Heart, Cœur. ☘: Shamrock, Trèfle. ✶: Star, Étoile.
data` 元素所有当前引擎都支持。
所有当前引擎都支持。
value — 机器可读的值[Exposed =Window ]
interface HTMLDataElement : HTMLElement {
[HTMLConstructor ] constructor ();
[CEReactions ] attribute DOMString value ;
};`data`元素`表示`其内容，以及`value`属性中这些内容的机器可读形式。
`value`属性必须存在。其值必须是元素内容以机器可读格式表示的形式。
当值为日期或时间相关时，可以使用更具体的`time`元素来代替。
该元素可用于多种用途。
与微格式或本规范中定义的`微数据属性`结合使用时，该元素用于为数据处理器的目的提供机器可读的值，以及为在网络浏览器中呈现的目的提供人类可读的值。在这种情况下，`value`属性中使用的格式由正在使用的微格式或微数据词汇表确定。
但是，该元素也可以与页面中的脚本结合使用，用于当脚本需要在人类可读值旁边存储字面值时。在这种情况下，使用的格式仅取决于脚本的需求。（`data-*`属性在这种情况下也可能很有用。）
所有当前引擎都支持。
`value` IDL属性必须`反映`同名内容属性。
在这里，一个简短的表格使用`data`元素对其数值进行编码，以便表格排序JavaScript库能够在每一列上提供排序机制，即使数字在一个列中以文本形式呈现，在另一个列中以分解形式呈现。
< script src = "sortable.js" ></ script >
< table class = "sortable" >
< thead > < tr > < th > Game < th > Corporations < th > Map Size
< tbody >
< tr > < td > 1830 < td > < data value = "8" > Eight</ data > < td > < data value = "93" > 19+74 hexes (93 total)</ data >
< tr > < td > 1856 < td > < data value = "11" > Eleven</ data > < td > < data value = "99" > 12+87 hexes (99 total)</ data >
< tr > < td > 1870 < td > < data value = "10" > Ten</ data > < td > < data value = "149" > 4+145 hexes (149 total)</ data >
</ table > time` 元素所有当前引擎都支持。
所有当前引擎都支持。
datetime`属性：`短语内容`。datetime — 机器可读的值[Exposed =Window ]
interface HTMLTimeElement : HTMLElement {
[HTMLConstructor ] constructor ();
[CEReactions ] attribute DOMString dateTime ;
};`time`元素`表示`其内容，以及`datetime`属性中这些内容的机器可读形式。内容的种类限于各种日期、时间、时区偏移量和持续时间，如下所述。
`datetime`属性可以存在。如果存在，其值必须是元素内容以机器可读格式表示的形式。
没有`datetime`内容属性的`time`元素不能有任何元素后代。
一个 time 元素的 日期时间值 是该元素的 datetime 内容属性的值（如果存在），否则为 time 元素的 子文本内容。
< time > 2011-11</ time > < time > 2011-11-18</ time > < time > 11-18</ time > < time > 14:54</ time > < time > 14:54:39</ time > < time > 14:54:39.929</ time > < time > 2011-11-18T14:54</ time > < time > 2011-11-18T14:54:39</ time > < time > 2011-11-18T14:54:39.929</ time > < time > 2011-11-18 14:54</ time > < time > 2011-11-18 14:54:39</ time > < time > 2011-11-18 14:54:39.929</ time > 带有日期但没有时区偏移量的时间对于指定在每个时区整天都观察到的相同特定时间的事件很有用。例如，2020 年新年在每个时区于 2020-01-01 00:00 庆祝，而不是在所有时区都精确地同时庆祝。对于在所有时区同时发生的事件（例如视频会议），有效的全球日期和时间字符串 可能更有用。
< time > Z</ time > < time > +0000</ time > < time > +00:00</ time > < time > -0800</ time > < time > -08:00</ time > 对于没有日期的时间（或指代在多个日期重复发生的事件的时间），指定控制时间的地理位置通常比指定时区偏移量更有用，因为地理位置会随着夏令时改变时区偏移量。在某些情况下，地理位置甚至会改变时区，例如当这些时区的边界重新绘制时，就像萨摩亚在 2011 年底发生的那样。存在一个描述时区边界以及每个时区内适用哪些规则的时区数据库，称为时区数据库。[TZDATABASE]
< time > 2011-11-18T14:54Z</ time > < time > 2011-11-18T14:54:39Z</ time > < time > 2011-11-18T14:54:39.929Z</ time > < time > 2011-11-18T14:54+0000</ time > < time > 2011-11-18T14:54:39+0000</ time > < time > 2011-11-18T14:54:39.929+0000</ time > < time > 2011-11-18T14:54+00:00</ time > < time > 2011-11-18T14:54:39+00:00</ time > < time > 2011-11-18T14:54:39.929+00:00</ time > < time > 2011-11-18T06:54-0800</ time > < time > 2011-11-18T06:54:39-0800</ time > < time > 2011-11-18T06:54:39.929-0800</ time > < time > 2011-11-18T06:54-08:00</ time > < time > 2011-11-18T06:54:39-08:00</ time > < time > 2011-11-18T06:54:39.929-08:00</ time > < time > 2011-11-18 14:54Z</ time > < time > 2011-11-18 14:54:39Z</ time > < time > 2011-11-18 14:54:39.929Z</ time > < time > 2011-11-18 14:54+0000</ time > < time > 2011-11-18 14:54:39+0000</ time > < time > 2011-11-18 14:54:39.929+0000</ time > < time > 2011-11-18 14:54+00:00</ time > < time > 2011-11-18 14:54:39+00:00</ time > < time > 2011-11-18 14:54:39.929+00:00</ time > < time > 2011-11-18 06:54-0800</ time > < time > 2011-11-18 06:54:39-0800</ time > < time > 2011-11-18 06:54:39.929-0800</ time > < time > 2011-11-18 06:54-08:00</ time > < time > 2011-11-18 06:54:39-08:00</ time > < time > 2011-11-18 06:54:39.929-08:00</ time > 带有日期和时区偏移量的时间对于指定特定事件或重复发生的虚拟事件很有用，在这些事件中，时间没有锚定到特定的地理位置。例如，小行星撞击的精确时间，或者在一系列每天 1400 UTC 举行的会议中特定会议的精确时间，无论世界任何特定部分是否正在观察夏令时。对于事件发生的精确时间因特定地理位置的本地时区偏移量而异，则结合该地理位置的 有效的本地日期和时间字符串 可能更有用。
< time > 2011-W47</ time > < time > 2011</ time > < time > 0001</ time > < time > PT4H18M3S</ time > < time > 4h 18m 3s</ time > 必须从元素的 日期时间值 中获取 元素内容的机器可读等效项，方法是使用以下算法
如果从元素的 日期时间值 中 解析无年份日期字符串 返回一个 无年份日期，则该无年份日期是机器可读等效项；返回。
如果从元素的 日期时间值 中 解析本地日期和时间字符串 返回一个 本地日期和时间，则该本地日期和时间是机器可读等效项；返回。
如果从元素的 日期时间值 中 解析时区偏移量字符串 返回一个 时区偏移量，则该时区偏移量是机器可读等效项；返回。
如果从元素的 日期时间值 中 解析全球日期和时间字符串 返回一个 全球日期和时间，则该全球日期和时间是机器可读等效项；返回。
如果元素的 日期时间值 仅由 ASCII 数字 组成，其中至少一个不是 U+0030 数字零 (0)，则机器可读等效项是这些数字的十进制解释，表示年份；返回。
没有机器可读等效项。
上面引用的算法旨在设计为，对于任何任意字符串 s，只有一个算法返回一个值。一种更有效的方法可能是创建一个单一的算法，在一次遍历中解析所有这些数据类型；开发这种算法留给读者作为练习。
所有当前引擎都支持。
dateTime IDL 属性必须 反映 元素的 datetime 内容属性。
timetime
< div class = "vevent" >
< a class = "url" href = "http://www.web2con.com/" > http://www.web2con.com/</ a >
< span class = "summary" > Web 2.0 Conference</ span > :
< time class = "dtstart" datetime = "2005-10-05" > October 5</ time > -
< time class = "dtend" datetime = "2005-10-07" > 7</ time > ,
at the < span class = "location" > Argent Hotel, San Francisco, CA</ span >
</ div > 这里，一个基于 Atom 词汇表的虚构微数据词汇表与 time
< article itemscope itemtype = "https://n.example.org/rfc4287" >
< h1 itemprop = "title" > Big tasks</ h1 >
< footer > Published < time itemprop = "published" datetime = "2009-08-29" > two days ago</ time > .</ footer >
< p itemprop = "content" > Today, I went out and bought a bike for my kid.</ p >
</ article > 在此示例中，另一篇文章的发布日期使用 time
< article itemscope itemtype = "http://schema.org/BlogPosting" >
< h1 itemprop = "headline" > Small tasks</ h1 >
< footer > Published < time itemprop = "datePublished" datetime = "2009-08-30" > yesterday</ time > .</ footer >
< p itemprop = "articleBody" > I put a bike bell on her bike.</ p >
</ article > 在以下代码段中，time
< p > Our first date was < time datetime = "2006-09-23" > a Saturday</ time > .</ p > 在此第二个代码段中，该值包括一个时间
< p > We stopped talking at < time datetime = "2006-09-24T05:00-07:00" > 5am the next morning</ time > .</ p > 页面加载的脚本（因此可以访问页面使用 timetime
例如，此元素传达字符串“星期五”，并附加语义，即 2011 年 11 月 18 日是对应于“星期五”的含义
Today is < time datetime = "2011-11-18" > Friday</ time > .在此示例中，指定了太平洋标准时间时区中的特定时间
Your next meeting is at < time datetime = "2011-11-18T15:00-08:00" > 3pm</ time > .code 元素所有当前引擎都支持。
HTMLElement。code
没有正式的方法来指示正在标记的计算机代码的语言。希望用所用语言标记 codeclasslanguage-”为前缀的类。
以下示例显示了如何在段落中使用该元素来标记元素名称和计算机代码，包括标点符号。
< p > The < code > code</ code > element represents a fragment of computer
code.</ p >
< p > When you call the < code > activate()</ code > method on the
< code > robotSnowman</ code > object, the eyes glow.</ p >
< p > The example below uses the < code > begin</ code > keyword to indicate
the start of a statement block. It is paired with an < code > end</ code >
keyword, which is followed by the < code > .</ code > punctuation character
(full stop) to indicate the end of the program.</ p > 以下示例显示了如何使用 precode
< pre >< code class = "language-pascal" > var i: Integer;
begin
i := 1;
end.</ code ></ pre > 在该示例中，使用一个类来指示所用语言。
有关更多详细信息，请参阅 pre
var 元素所有当前引擎都支持。
HTMLElement。var
在下段中，字母“n”用作散文中使用的变量
< p > If there are < var > n</ var > pipes leading to the ice
cream factory then I expect at < em > least</ em > < var > n</ var >
flavors of ice cream to be available for purchase!</ p > 对于数学，特别是对于最简单的表达式之外的任何内容，MathML 更合适。但是，var
在此示例中，显示了一个方程式，并带有一个引用方程式中变量的图例。表达式本身用 MathML 标记，但变量在图例中使用 var
< figure >
< math >
< mi > a</ mi >
< mo > =</ mo >
< msqrt >
< msup >< mi > b</ mi >< mn > 2</ mn ></ msup >
< mi > +</ mi >
< msup >< mi > c</ mi >< mn > 2</ mn ></ msup >
</ msqrt >
</ math >
< figcaption >
Using Pythagoras' theorem to solve for the hypotenuse < var > a</ var > of
a triangle with sides < var > b</ var > and < var > c</ var >
</ figcaption >
</ figure > 这里，描述质量-能量等价关系的方程式用在一个句子中，并且 var
< p > Then she turned to the blackboard and picked up the chalk. After a few moment's
thought, she wrote < var > E</ var > = < var > m</ var > < var > c</ var >< sup > 2</ sup > . The teacher
looked pleased.</ p > samp 元素所有当前引擎都支持。
HTMLElement。samp
此元素可以与output元素形成对比，后者可用于在 Web 应用程序中提供即时输出。
此示例显示了samp元素的内联使用。
< p > The computer said < samp > Too much cheese in tray
two</ samp > but I didn't know what that meant.</ p > 第二个示例显示了来自控制台程序的一段示例输出。嵌套的samp和kbd元素允许使用样式表对示例输出的特定元素进行样式设置。此外，samp的部分内容还使用了更详细的标记进行注释，以实现非常精确的样式设置。为此，使用了span元素。
< pre >< samp >< span class = "prompt" > jdoe@mowmow:~$</ span > < kbd > ssh demo.example.com</ kbd >
Last login: Tue Apr 12 09:10:17 2005 from mowmow.example.com on pts/1
Linux demo 2.6.10-grsec+gg3+e+fhs6b+nfs+gr0501+++p3+c4a+gr2b-reslog-v6.189 #1 SMP Tue Feb 1 11:22:36 PST 2005 i686 unknown
< span class = "prompt" > jdoe@demo:~$</ span > < span class = "cursor" > _</ span ></ samp ></ pre > 第三个示例显示了一段输入及其相应的输出。此示例同时使用了code和samp元素。
< pre >
< code class = "language-javascript" > console.log(2.3 + 2.4)</ code >
< samp > 4.699999999999999</ samp >
</ pre > kbd 元素所有当前引擎都支持。
HTMLElement。kbd元素表示用户输入（通常是键盘输入，但也可用于表示其他输入，例如语音命令）。
当kbd元素包含samp元素时，它表示基于系统输出的输入，例如调用菜单项。
当kbd元素嵌套在另一个kbd元素内时，它表示实际的键或其他单个输入单元，具体取决于输入机制。
此处，kbd元素用于指示要按下的键。
< p > To make George eat an apple, press < kbd >< kbd > Shift</ kbd > + < kbd > F3</ kbd ></ kbd ></ p > 在此第二个示例中，用户被告知选择特定的菜单项。外部kbd元素标记了一块输入，内部kbd元素表示输入的每个单独步骤，而它们内部的samp元素指示这些步骤是基于系统显示的内容（在本例中为菜单标签）进行输入的。
< p > To make George eat an apple, select
< kbd >< kbd >< samp > File</ samp ></ kbd > |< kbd >< samp > Eat Apple...</ samp ></ kbd ></ kbd >
</ p > 这样的精确度不是必需的；以下方法也同样有效。
< p > To make George eat an apple, select < kbd > File | Eat Apple...</ kbd ></ p > sub 和 sup 元素所有当前引擎都支持。
所有当前引擎都支持。
sub 元素：供作者使用；供实现者使用。sup 元素：供作者使用；供实现者使用。HTMLElement。这些元素必须仅用于标记具有特定含义的排版约定，而不是为了排版而进行排版。例如，在 LaTeX 文档准备系统名称中使用sub和sup元素是不合适的。一般而言，作者只有在缺少这些元素会导致内容含义发生变化时才应使用这些元素。
在某些语言中，上标是某些缩写的排版约定的一部分。
< p > Their names are
< span lang = "fr" >< abbr > M< sup > lle</ sup ></ abbr > Gwendoline</ span > and
< span lang = "fr" >< abbr > M< sup > me</ sup ></ abbr > Denise</ span > .</ p > 此处，sub元素用于表示标识变量族中变量的下标。
< p > The coordinate of the < var > i</ var > th point is
(< var > x< sub >< var > i</ var ></ sub ></ var > , < var > y< sub >< var > i</ var ></ sub ></ var > ).
For example, the 10th point has coordinate
(< var > x< sub > 10</ sub ></ var > , < var > y< sub > 10</ sub ></ var > ).</ p > 数学表达式通常使用下标和上标。鼓励作者使用MathML来标记数学内容，但如果不需要详细的数学标记，作者可以选择使用sub和sup。 [MATHML]
< var > E</ var > =< var > m</ var >< var > c</ var >< sup > 2</ sup > f(< var > x</ var > , < var > n</ var > ) = log< sub > 4</ sub >< var > x</ var >< sup >< var > n</ var ></ sup > i 元素所有当前引擎都支持。
HTMLElement。i元素表示一段文本，其语音或语气不同于普通文本，或者以某种方式与普通文本有所区别，表明文本的质量不同，例如分类学名称、专业术语、来自另一种语言的习语、音译、想法或西方文本中的船名。
与主要文本不同的语言中的术语应使用lang属性（或在 XML 中，在XML 命名空间中使用lang属性）进行注释。
以下示例显示了i元素的使用。
< p > The < i class = "taxonomy" > Felis silvestris catus</ i > is cute.</ p >
< p > The term < i > prose content</ i > is defined above.</ p >
< p > There is a certain < i lang = "fr" > je ne sais quoi</ i > in the air.</ p > 在以下示例中，使用i元素标记了梦境序列。
< p > Raymond tried to sleep.</ p >
< p >< i > The ship sailed away on Thursday</ i > , he
dreamt. < i > The ship had many people aboard, including a beautiful
princess called Carey. He watched her, day-in, day-out, hoping she
would notice him, but she never did.</ i ></ p >
< p >< i > Finally one night he picked up the courage to speak with
her—</ i ></ p >
< p > Raymond woke with a start as the fire alarm rang out.</ p > 作者可以在i元素上使用class属性来标识使用此元素的原因，以便如果日后需要更改特定用途的样式（例如梦境序列与分类学术语），作者无需遍历整个文档（或一系列相关文档）来注释每个用途。
鼓励作者考虑其他元素是否比i元素更适用，例如，em元素用于标记强调，或dfn元素用于标记术语的定义实例。
样式表可用于设置i元素的格式，就像任何其他元素一样可以重新设置样式。因此，i元素中的内容不一定会被设置为斜体。
b 元素所有当前引擎都支持。
HTMLElement。b元素表示一段文本，其目的是为了吸引注意力，但不传达任何额外的重要性，也不暗示任何不同的声音或语气，例如文档摘要中的关键词、评论中的产品名称、文本驱动交互式软件中的可操作词或文章导语。
以下示例显示了b元素的使用，用于突出显示关键词，而不会将其标记为重要。
< p > The < b > frobonitor</ b > and < b > barbinator</ b > components are fried.</ p > 在以下示例中，文本冒险游戏中的对象通过使用b元素被突出显示为特殊对象。
< p > You enter a small room. Your < b > sword</ b > glows
brighter. A < b > rat</ b > scurries past the corner wall.</ p > 另一个b元素适用的情况是标记导语（或导语）句子或段落。以下示例显示了如何标记一篇关于小猫收养兔子作为自己宠物的 BBC 文章。
< article >
< h2 > Kittens 'adopted' by pet rabbit</ h2 >
< p >< b class = "lede" > Six abandoned kittens have found an
unexpected new mother figure — a pet rabbit.</ b ></ p >
< p > Veterinary nurse Melanie Humble took the three-week-old
kittens to her Aberdeen home.</ p >
[...]与i元素一样，作者可以在b元素上使用class属性来标识使用此元素的原因，以便如果日后需要更改特定用途的样式，作者无需遍历整个文档来注释每个用途。
b元素应作为最后的手段使用，当没有其他更合适的元素时才使用。特别是，标题应使用h1到h6元素，强调应使用em元素，重要性应使用strong元素表示，而标记或突出显示的文本应使用mark元素。
样式表可用于设置b元素的格式，就像任何其他元素一样可以重新设置样式。因此，b元素中的内容不一定会被加粗。
u 元素所有当前引擎都支持。
HTMLElement。u元素表示一段文本，其中包含未明确说明但明确呈现的非文本注释，例如在中文文本中将文本标记为专有名词（中文专有名词标记），或将文本标记为拼写错误。
在大多数情况下，其他元素可能更合适：用于标记强调，应使用em元素；用于标记关键词或短语，应根据上下文使用b元素或mark元素；用于标记书名，应使用cite元素；用于用明确的文本注释标记文本，应使用ruby元素；用于标记术语、分类学名称、音译、想法或西方文本中的船名，应使用i元素。
在视觉呈现中，u元素的默认渲染与超链接的常规渲染（下划线）冲突。鼓励作者避免在可能将其与超链接混淆的地方使用u元素。
在此示例中，u元素用于将单词标记为拼写错误。
< p > The < u > see</ u > is full of fish.</ p > mark 元素所有当前引擎都支持。
HTMLElement。mark元素表示一个文档中的一段文本，由于其在另一个上下文中的相关性，因此被标记或突出显示以供参考。当在引号或其他从散文引用的文本块中使用时，它表示最初不存在但已添加以吸引读者注意文本的一部分的突出显示，在撰写该文本块时，原始作者可能没有认为该部分很重要，但现在却受到了之前未预料到的仔细审查。当在文档的主要散文中使用时，它表示文档中已突出显示的部分，因为该部分可能与用户的当前活动相关。
此示例显示了如何使用mark元素来引起人们对引文特定部分的注意。
< p lang = "en-US" > Consider the following quote:</ p >
< blockquote lang = "en-GB" >
< p > Look around and you will find, no-one's really
< mark > colour</ mark > blind.</ p >
</ blockquote >
< p lang = "en-US" > As we can tell from the < em > spelling</ em > of the word,
the person writing this quote is clearly not American.</ p > （但是，如果目标是将元素标记为拼写错误，则u元素（可能带有类）会更合适。）
mark元素的另一个示例是突出显示与某个搜索字符串匹配的文档部分。如果有人查看了一个文档，并且服务器知道用户正在搜索“kitten”一词，则服务器可能会返回修改后的文档，其中包含以下修改的一段：
< p > I also have some < mark > kitten</ mark > s who are visiting me
these days. They're really cute. I think they like my garden! Maybe I
should adopt a < mark > kitten</ mark > .</ p > 在以下代码片段中，一段文本引用了代码片段的特定部分。
< p > The highlighted part below is where the error lies:</ p >
< pre >< code > var i: Integer;
begin
i := < mark > 1.1</ mark > ;
end.</ code ></ pre > 这与语法高亮不同，后者更适合使用span。结合两者，将得到
< p > The highlighted part below is where the error lies:</ p >
< pre >< code >< span class = keyword > var</ span > < span class = ident > i</ span > : < span class = type > Integer</ span > ;
< span class = keyword > begin</ span >
< span class = ident > i</ span > := < span class = literal >< mark > 1.1</ mark ></ span > ;
< span class = keyword > end</ span > .</ code ></ pre > 这是另一个示例，它显示了使用mark来突出显示最初未强调的引文部分。在此示例中，常见的排版约定导致作者在引号中的mark元素显式地使用斜体进行渲染。
< style >
blockquote mark , q mark {
font : inherit ; font-style : italic ;
text-decoration : none ;
background : transparent ; color : inherit ;
}
. bubble em {
font : inherit ; font-size : larger ;
text-decoration : underline ;
}
</ style >
< article >
< h1 > She knew</ h1 >
< p > Did you notice the subtle joke in the joke on panel 4?</ p >
< blockquote >
< p class = "bubble" > I didn't < em > want</ em > to believe. < mark > Of course
on some level I realized it was a known-plaintext attack.</ mark > But I
couldn't admit it until I saw for myself.</ p >
</ blockquote >
< p > (Emphasis mine.) I thought that was great. It's so pedantic, yet it
explains everything neatly.</ p >
</ article > 顺便说一下，请注意此示例中em元素（它是引用的原始文本的一部分）与mark元素（它突出显示了部分内容以供评论）之间的区别。
以下示例显示了表示文本跨度的重要性（strong）与表示文本跨度的相关性（mark）之间的区别。它摘自一本教科书，其中摘录部分已突出显示与考试相关的部分。尽管安全警告可能很重要，但显然与考试无关。
< h3 > Wormhole Physics Introduction</ h3 >
< p >< mark > A wormhole in normal conditions can be held open for a
maximum of just under 39 minutes.</ mark > Conditions that can increase
the time include a powerful energy source coupled to one or both of
the gates connecting the wormhole, and a large gravity well (such as a
black hole).</ p >
< p >< mark > Momentum is preserved across the wormhole. Electromagnetic
radiation can travel in both directions through a wormhole,
but matter cannot.</ mark ></ p >
< p > When a wormhole is created, a vortex normally forms.
< strong > Warning: The vortex caused by the wormhole opening will
annihilate anything in its path.</ strong > Vortexes can be avoided when
using sufficiently advanced dialing technology.</ p >
< p >< mark > An obstruction in a gate will prevent it from accepting a
wormhole connection.</ mark ></ p > bdi 元素所有当前引擎都支持。
dir全局属性在此元素上具有特殊语义。HTMLElement。bdi元素表示一段文本，该文本为了双向文本格式化的目的而与其周围环境隔离开。 [BIDI]
dir全局属性在此元素上默认为auto（它不像其他元素那样从父元素继承）。
此元素具有涉及双向算法的渲染要求。
此元素在嵌入方向未知的用户生成内容时特别有用。
在此示例中，用户名与其提交的帖子数量一起显示。如果没有使用bdi元素，阿拉伯用户的用户名最终会使文本混乱（双向算法会将冒号和数字“3”放在“User”一词旁边，而不是放在“posts”一词旁边）。
< ul >
< li > User < bdi > jcranmer</ bdi > : 12 posts.
< li > User < bdi > hober</ bdi > : 5 posts.
< li > User < bdi > إيان</ bdi > : 3 posts.
</ ul > 
bdi元素时，用户名按预期工作。
bdi元素替换为b元素，则用户名会使双向算法混乱，第三个项目符号将最终显示为“User 3 :”，后跟阿拉伯名称（从右到左），后跟“posts”和句点。bdo 元素所有当前引擎都支持。
dir全局属性在此元素上具有特殊语义。HTMLElement。bdo元素表示其子元素的显式文本方向格式控制。它允许作者通过显式指定方向覆盖来覆盖 Unicode 双向算法。 [BIDI]
作者必须在此元素上指定dir属性，使用值ltr指定从左到右的覆盖，使用值rtl指定从右到左的覆盖。不得指定auto值。
此元素具有涉及双向算法的渲染要求。
span 元素所有当前引擎都支持。
所有当前引擎都支持。
[Exposed =Window ]
interface HTMLSpanElement : HTMLElement {
[HTMLConstructor ] constructor ();
};span元素本身没有任何含义，但在与全局属性一起使用时非常有用，例如class、lang或dir。它表示其子元素。
在此示例中，代码片段使用span元素和class属性进行标记，以便其关键字和标识符可以从 CSS 中进行颜色编码。
< pre >< code class = "lang-c" >< span class = "keyword" > for</ span > (< span class = "ident" > j</ span > = 0; < span class = "ident" > j</ span > < 256; < span class = "ident" > j</ span > ++) {
< span class = "ident" > i_t3</ span > = (< span class = "ident" > i_t3</ span > & 0x1ffff) | (< span class = "ident" > j</ span > << 17);
< span class = "ident" > i_t6</ span > = (((((((< span class = "ident" > i_t3</ span > >> 3) ^ < span class = "ident" > i_t3</ span > ) >> 1) ^ < span class = "ident" > i_t3</ span > ) >> 8) ^ < span class = "ident" > i_t3</ span > ) >> 5) & 0xff;
< span class = "keyword" > if</ span > (< span class = "ident" > i_t6</ span > == < span class = "ident" > i_t1</ span > )
< span class = "keyword" > break</ span > ;
}</ code ></ pre > br 元素所有当前引擎都支持。
所有当前引擎都支持。
[Exposed =Window ]
interface HTMLBRElement : HTMLElement {
[HTMLConstructor ] constructor ();
// also has obsolete members
};虽然换行符通常在视觉媒体中通过将后续文本物理地移动到新行来表示，但样式表或用户代理同样有理由以不同的方式呈现换行符，例如绿点或额外的间距。
br元素必须仅用于实际上是内容一部分的换行符，例如诗歌或地址。
以下示例是br元素的正确用法。
< p > P. Sherman< br >
42 Wallaby Way< br >
Sydney</ p > br元素不得用于分隔段落中的主题组。
以下示例不符合标准，因为它们滥用了br元素。
< p >< a ...> 34 comments.</ a >< br >
< a ...> Add a comment.</ a ></ p > < p >< label > Name: < input name = "name" ></ label >< br >
< label > Address: < input name = "address" ></ label ></ p > 以下是上述内容的替代方案，这些方案是正确的。
< p >< a ...> 34 comments.</ a ></ p >
< p >< a ...> Add a comment.</ a ></ p > < p >< label > Name: < input name = "name" ></ label ></ p >
< p >< label > Address: < input name = "address" ></ label ></ p > 如果一个段落仅包含单个br元素，则它表示占位符空白行（例如，在模板中）。此类空白行不得用于演示目的。
br元素内的任何内容都不得视为周围文本的一部分。
此元素具有涉及双向算法的渲染要求。
wbr 元素所有当前引擎都支持。
HTMLElement。在下面的示例中，有人被引用说了一些话，为了效果，写成一个长词。但是，为了确保文本可以以易于阅读的方式换行，引文中的各个单词使用wbr 元素分隔。
< p > So then she pointed at the tiger and screamed
"there< wbr > is< wbr > no< wbr > way< wbr > you< wbr > are< wbr > ever< wbr > going< wbr > to< wbr > catch< wbr > me"!</ p > wbr 元素内部的任何内容都不应被视为周围文本的一部分。
var wbr = document. createElement( "wbr" );
wbr. textContent = "This is wrong" ;
document. body. appendChild( wbr); 此元素具有涉及双向算法的渲染要求。
本节是非规范性的。
| 元素 | 用途 | 示例 |
|---|---|---|
a
| 超链接 | |
em
| 强调 | |
strong
| 重要性 | |
small
| 旁注 | |
s
| 错误文本 | |
cite
| 作品标题 | |
q
| 引用 | |
dfn
| 定义实例 | |
abbr
| 缩写 | |
ruby, rt, rp | Ruby 注解 | |
data
| 机器可读等价物 | |
time
| 日期或时间相关数据的机器可读等价物 | |
code
| 计算机代码 | |
var
| 变量 | |
samp
| 计算机输出 | |
kbd
| 用户输入 | |
sub
| 下标 | |
sup
| 上标 | |
i
| 替代声音 | |
b
| 关键词 | |
u
| 注释 | |
mark
| 高亮 | |
bdi
| 文本方向隔离 | |
bdo
| 文本方向格式化 | |
span
| 其他 | |
br
| 换行 | |
wbr
| 换行机会 | |