HTML5标题(即h1,h2,h3等)中可以使用<small>标签吗?

28

我不确定 HTML5 中的标题约定,但我想知道是否可以在 <h3> 中添加一个 <small>,就像这样(这适用于任何标签内部的任何标题标签):

<h3>Payment details <small>(this is your default card)</small></h3>
4个回答

21

7

标题元素的规范:

规范表明它具有分步内容模型:

Content model:
    Phrasing content.

查看与分阶段内容模型相关的规范部分:

它说:

注意:大多数被归类为分阶段内容的元素只能包含那些本身被归类为分阶段内容的元素,而不能包含任何流内容。

此外,您不能将标题放在另一个标题中 - 这是来自W3C验证器的信息:

Error Line 1, Column 23: Heading cannot be a child of another heading.

<!DOCTYPE html><h1><h2></h2></h1>

尽管在规范中我没有找到明确说明,但似乎存在一些相当特定的限制。这可能会导致一些非常奇怪的行为,例如上述HTML实际上将被解析为:
<h1></h1><h2></h2>

例如,查看此SOq以了解它可能引起的间接问题:

以防万一有人遇到这种情况...


“phrasing content” 部分列出了有效的元素,但不包括 h1...h6。 - Olaf Dietsche
谢谢@OlafDietsche!这很有趣 - 列出h1..h6元素的页面明确表示内容模型是短语内容。另一方面,流内容特别包括h1...h6。从概念上看,我同意您的评论。 - icyrock.com

6

我认为规范中没有任何限制。只有空元素不能有子元素。请参见http://dev.w3.org/html5/markup/syntax.html#void-element

尽管通常H1、H2、H3等标题会以相同的大小呈现,但对于类似于"(this is your default card)"这样的子标题,可以使用较小的H,例如H4。


4
建议使用较低的标题标签而不是<small>标签,可以将两个标题标签都包含在<hgroup>中。 - Ian Oxley
3
@planetjones说:“我不认为那是正确的。例如<h1>bla<h2>bla</h2></h1>是无法通过验证的,因为“标题不能是另一个标题的子元素”。 - RubenGeert

1

我认为规范中没有对此进行限制。只有无内容元素不能具有子元素。请参见http://dev.w3.org/html5/markup/syntax.html#void-element

无内容元素是指其内容模型在任何情况下都不允许其具有内容的元素。无内容元素可以具有属性。

以下是HTML中无内容元素的完整列表:

area, base, br, col, command, embed, hr, img, input, keygen, link,
meta, param, source, track, wbr

通常情况下,h1、h2、h3等标题会以相同的字体大小呈现。但是对于像“(这是您的默认卡片)”这样的子标题,您可以使用较小的标题,例如h4。


你的回答与上面提供的这个回答有何不同?看起来你的回答是复制粘贴的。 - Frederik Krautwald

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接