Question

我想知道是否可以在标题中插入图例。这样，图例也可以具有与整个文档相关的层次结构。

我的下面有更多文字是相关的，但需要为读者突出显示。在这种情况下，个人信息将同时为legend和h2。 h1将是我选择不显示的网站中的另一个元素。

<fieldset>

   <h2>
     <legend>Personal information</legend>
   </h2>

   <h3>
     Credentials
   </h3>
   <label for="username">
      Username
   </label>
   <input id="username" type="text">
  <label for="surname">
      Surname
  </label>
  <input id="surname" type="text">

  <h3>
     Contact details
   </h3>
   <label for="street">
      Street
   </label>
   <input id="street" type="text">
  <label for="house-number">
      House number
  </label>
  <input id="house-number" type="number">

</fieldset>

Answer 1

如https://developer.mozilla.org/it/docs/Web/HTML/Element/legend

中所述

允许的父元素：{{1>} 第一个孩子是此<fieldset>元素

在您的示例中，<legend>元素不是其祖先<legend>的第一个子，因此它不是有效的HTML5标记。

此外请注意，还要恢复元素的顺序，如此

<fieldset>

标记不会仍然有效，因为<legend><h2>Personal information</h2></legend>仅允许phrasing content

Answer 2

元素legend不允许作为元素h1的子元素。仅作为fieldset的孩子。

引自W3C验证器 -

可以使用元素图例的上下文：作为字段集元素的第一个孩子。

标题中的图例是否有效？ <h1> <legend>标题</legend> </h1>

2 个答案: