用于括号的最佳 HTML5 元素是什么？答案

【问题标题】：What's the best HTML5 element to use for a parenthetical?用于括号的最佳 HTML5 元素是什么？
【发布时间】：2013-10-10 20:33:12
【问题描述】：

我一直在寻找一个 HTML5 元素来标记括号中的文本。我的第一直觉是使用<ASIDE> 元素，但the HTML5 definition 明确表示：

注意：仅在括号中使用aside 元素是不合适的，因为它们是文档主要流程的一部分。

那么，括号应该用什么？

实施

以下是我最终使用的。感谢 unor 指出 <SMALL> 被定义为代表“side cmets”，IMO 包含括号。

CSS：

SMALL.parenthetical {
    font-size: inherit;
}
    SMALL.parenthetical:before {
        content: "(";
    }
    SMALL.parenthetical:after {
        content: ")";
    }

HTML：

<P>Today I wrote some code <SMALL CLASS="parenthetical">In CSS and HTML</SMALL> that helped me out greatly</P>

【问题讨论】：

作为<aside>，作为一个对语义标记做的不多的人：为什么要使用标准括号以外的任何东西作为括号？似乎只是一小步，寻找句子从句的标记，时态......完全出于好奇，你的用例是什么？
SEO，因为我们的搜索引擎可以通过这种方式更轻松地识别括号。翻译，因为非英语语言使用圆括号以外的括号（如日语中的【和】）。样式，因为在未来，我们可能会决定 [ 和 ] 或 ⟨ 和 ⟩ 在页面上比 ( and ) 看起来更好。简而言之，同样的原因你会使用<Q></Q> 而不是""
@MichaelPetrotta：很高兴能够从摘录中排除括号，例如。维基百科文章介绍，开头句前经常包含翻译、发音、出生日期等。

标签： html semantic-markup parentheses

【解决方案1】：

括号没有特定的元素。

在某些情况下，small element 可能是合适的。

您必须使用标点符号（例如，圆括号 ( 和 )）明确作为 HTML 的一部分（因此不通过 CSS content)。

如果您希望能够设置整个括号的样式。括号，你应该使用span元素，因为它们没有任何意义。例如：

<p>At vero eos duo <span class="parenthesis">(consetetur sadipscing elitr)</span> dolores et ea rebum.</p> 

<p>At vero eos duo <span class="parenthesis-start">(</span>consetetur sadipscing elitr<span class="parenthesis-end">)</span> dolores et ea rebum.</p>

现在您可以通过 CSS 的 ::after 和 ::before 伪元素直观地隐藏括号并添加其他标点符号（或类似符号）。

【讨论】：

请详细说明；为什么我要明确“必须使用”括号？
@Supuhstar：因为没有特定的元素（类似于q），我们不能依赖用户代理提供标点符号。 CSS-only 添加标点符号（通过content 和伪元素）不会改变文档的含义，只会改变它的装饰；例如文本浏览器或屏幕阅读器用户将无法区分括号和周围的文本。
@unor HTML 的<ruby> 支持带有<rp> 的括号注释：参见developer.mozilla.org/en-US/docs/Web/HTML/Element/rp

【解决方案2】：

This 正是你要找的东西，如果我没记错的话。

【讨论】：

那些只是字符字符；我正在寻找最能代表括号的 DOM 元素（或者，更具体地说，是代表它们的标签）。也就是说，这是一个有用的页面，我会为它添加书签。