9

<figure>一个元素只包含a 是语义的<figcaption>吗?它确实验证...

<figure>
  <img src="example.jpg">
  <figcaption>Image and caption</figcaption>
</figure>

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

在这种情况下,它会对 CSS 样式产生影响:

figure figcaption { color: red; }
4

3 回答 3

9

Animg在元素中不是必需的figure,它恰好是常见的,并且大多数使用的示例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 元素的父图形元素(如果有<figcaption>)的其余内容的标题或图例。

请注意“如果有”部分,这使我相信除 之外的内容figcaption可能不存在并且仍然有效。然而,正如 Alochi 所指出的,它暗示了对元素的滥用,因为没有内容可供标题描述。

在当前的规范示例中有一个示例,即非图像内容伴随着 figcaption,所以我认为可以公平地假设没有图像是完全可以的:

在这里,一首诗的一部分是用图形标记的。

<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>
于 2012-12-05T19:26:54.067 回答
5

正如 Michael Malinovskij 回答的那样,图形元素应该包含“流内容”以及 figcaption。

HTML5 规范对流内容有这样的说法

作为一般规则,其内容模型允许任何流式内容或短语内容的元素应具有至少一个子节点,该子节点是可触知的内容并且不具有指定的隐藏属性。

但是,此要求不是硬性要求,因为在许多情况下元素可以合法地为空,例如,当它用作稍后将由脚本填充的占位符时,或者当元素是模板,并且会在大多数页面上填写,但在某些页面上不相关。

因此,除了 figcaption 之外没有任何其他内容是有效的,但是除非您打算稍后填写内容,否则它可能无法传达有用或正确的含义,这可能被描述为非语义

于 2012-12-05T19:28:42.483 回答
2

图允许的内容:

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

(c) w3c/图

于 2012-12-05T17:49:11.433 回答