一个 <figure> 元素能否只包含一个没有图片的 <figcaption> 元素?

9
< p >一个 <figure> 元素只包含一个 <figcaption> 元素,这是否符合语义化?它可以通过验证...< /p >
<figure>
  <img src="example.jpg">
  <figcaption>Image and caption</figcaption>
</figure>

<figure>
  <figcaption>Caption only</figcaption>
</figure>

在这个上下文中,它会对CSS样式产生影响。
figure figcaption { color: red; }
3个回答

10
<figure> 元素中并不需要有 <img>,通常情况下会有一个图像,因为大多数使用 <figcaption> 的例子也都有图像。

http://dev.w3.org/html5/spec/single-page.html#the-figure-element

因此,<figure> 元素可用于注释主文档引用的插图、图表、照片、代码清单等内容,但这些内容可以在不影响主文档流的情况下从主要内容中移开,例如移动到页面侧边、专门页面或附录。

http://dev.w3.org/html5/spec/single-page.html#the-figcaption-element

<figcaption> 元素代表其父级 <figure> 元素中其余内容的标题或图例,如果存在的话。

请注意 "if any" 部分,这使我相信即使没有其他内容,仅有 <figcaption> 也是有效的。然而,正如Alochi所指出的,这暗示着元素的误用,因为没有内容可以描述标题。
当前规范的示例中有一个非图像内容伴随着 <figcaption> 的例子,因此我认为没有图像是完全可以的。

Here, a part of a poem is marked up using figure.

<figure>
  <p>'Twas brillig, and the slithy toves<br>
  Did gyre and gimble in the wabe;<br>
  All mimsy were the borogoves,<br>
  And the mome raths outgrabe.</p>
  <figcaption>
    <cite>Jabberwocky</cite> (first verse).
    Lewis Carroll, 1832->  98
  </figcaption>
</figure>

5
如Michael Malinovskij所说,<figure>元素应包含“流内容”以及<figcaption>
HTML5规范对流内容有如下说明:The HTML5 spec has this to say about flow content

通常情况下,内容模型允许任何流内容或短语内容的元素应至少有一个子节点是有触感的内容,并且没有指定隐藏属性。

但这并不是硬性要求,因为有很多情况下,元素可以为空,例如当它用作占位符,稍后将由脚本填充时,或者当元素是模板的一部分,在大多数页面上会被填充,但在某些页面上不相关。

因此,只有<figcaption>元素是有效的。不过,除非您打算稍后填充内容,否则它可能无法传达有用或正确的含义,这可能被描述为无语义。

哦,我太过于专注于“没有图像”的部分了。一个没有内容的孤独的figcaption是没有意义的,对吧? - Wesley Murch
@WesleyMurch - 很难看出什么时候会有意义,是的。 - Alohci
很奇怪的是规范中说:“figcaption元素的父figure元素的其余内容的标题,如果有的话……”,听起来好像已经被考虑过了,没有除figcaption之外的内容也是可以的。但我无法理解这样做有什么意义。 - Wesley Murch

2

图形允许的内容:

  • 一个figcaption元素,后跟flow内容
  • flow内容后跟一个可选的figcaption元素

(c) w3c/figure


“跟随流内容”部分在W3C上被标记为灰色 - 不知道这是否如此明确... - Baumr

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