【问题标题】:How to markup explanatory text in HTML5?如何在 HTML5 中标记解释性文本?
【发布时间】:2021-01-23 11:27:27
【问题描述】:

我有一些完全用非英语(土耳其语)语言编写的内容。 (所以,我在顶部有<html lang="tr">。)在文本中,我使用了该语言的一些术语。我想为这样的术语添加一些“半视觉”内容,以提供其英语等效项(可能使用title 属性),以防读者想知道术语的确切英语等效项 em>(可能是通过将鼠标指针移到 term 上)。

<dfn> 标记不适用于此目的,因为大多数时候我不会在其祖先元素中定义 term;我只会使用它。一个简单的替代方法是将 term 包含在 <span> 元素中,并使用包含 term 的英文等效项的 title 属性。例如,

bla bla bla <span title="format">biçim</span> bla bla bla...

这里的“format”是非英语术语“biçim”的英语等价物。

请注意,在大多数情况下,我不希望 term 的呈现方式与其周围的文本不同。

实现这种语义需求的最佳 HTML5 标记是什么?

【问题讨论】:

  • 如果你使用title属性,浏览器会自动渲染一个tooltip。听起来您想实际修改该术语?
  • 使用标签的title属性显示的工具提示对我来说是可以的(虽然它不能在移动设备中使用);而且我不想就地修改 term 。我的问题是关于哪个 HTML5 标记比简单的&lt;span&gt; 标记更合适(语义上)。
  • 似乎没有特定的确切标签:developer.mozilla.org/en-US/docs/Web/HTML/…(如果翻译可能是 rtl 而不是 ltr,则可能是 bdi)

标签: html semantic-markup


【解决方案1】:

提供一个单独的字典(可能在正文之后)作为DL/DT/DD 列表,并从正文中引用相应的DT/DD 对。如果需要弹出窗口,它们可以在相同的静态语义标记之上实现。 SPAN 是 100% 无语义的通用元素,我不会在这种情况下使用它。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2016-03-03
    • 1970-01-01
    • 2016-01-09
    • 1970-01-01
    • 1970-01-01
    • 2021-06-24
    • 2017-03-06
    • 2015-02-07
    相关资源
    最近更新 更多