Question

HTML5有很好的标签用于描述。 w3.org给出了the following example：

<dl>
 <dt><dfn>happiness</dfn></dt>
 <dd class="pronunciation">/'hæ p. nes/</dd>
 <dd class="part-of-speech"><i><abbr>n.</abbr></i></dd>
 <dd>The state of being happy.</dd>
 <dd>Good fortune; success. <q>Oh <b>happiness</b>! It worked!</q></dd>
 <dt><dfn>rejoice</dfn></dt>
 <dd class="pronunciation">/ri jois'/</dd>
 <dd><i class="part-of-speech"><abbr>v.intr.</abbr></i> To be delighted oneself.</dd>
 <dd><i class="part-of-speech"><abbr>v.tr.</abbr></i> To cause one to be delighted.</dd>
</dl>

，描述<dd>元素可用作＆＃34; dt或dd元素dl元素＆＃34;。

这让我（一个完全的初学者）感到奇怪：这些dd元素是否应该属于到他们所描述的dt？因为<dt>happiness</dt>和<dd> The state of being happy</dd>肯定是彼此相关的，一个描述另一个？如果dt和dd没有结构对齐，则告诉特定dd描述的内容的唯一方法是找到最后一个dt。我觉得用（di每个项目）

之类的东西会更安全

<dl>
  <di>
    <dt><dfn>hapiness</dfn></dt>
    <dd class="pronunciation">/'hæ p. nes/</dd>
    <dd>The state of being happy</dd>
  </di>
</dl>

虽然我很想问'＃34;我是否正确地担心这个？＆＃34;，我的问题是：

在html5中使用dl时有哪些约定？他们是以某种方式对<dt>和<dd>进行分组，还是这样就好了？
如果我要对它们进行分组（如上所述，但使用标准标签），是否有任何可以在语义上使用的标签？

Answer 1

dl元素自早期以来就已成为HTML的一部分（正式自HTML 2.0以来），并且它一直被模糊地定义。名义上称为“定义列表”，它被解释为通常是“描述列表”或实际上只是“关联列表”。它将dt元素中的“名称”与其后的dd元素的内容相关联，直到下一个dt。如果有多个连续的dt元素，则它们都与以下dd元素相关联。

关联（分组）在description of dl中定义，但它是“纯语义”;它本身没有任何含义，你甚至不能使用一些中间标记来明确它，因为dl语法只允许dt和dd作为子项（和script，但这没有帮助。）

结论取决于您对该关联的期望。如果你真的需要一个组的容器，只需使用一些其他标记，让你输入你需要的标记。如果您希望该关联与辅助软件相关，您可以考虑使用ARIA属性，如an MDN page on ARIA:上的以下示例所示

<dl>
    <dt id="anathema">anthema</dt>
    <dd role="definition" aria-labelledby="anathema">a ban or curse solemnly pronounced
                                                     by ecclesiastical authority
                                                     and accompanied by excommunication</dd>
    <dd role="definition" aria-labelledby="anathema">a vigorous denunciation : cursor</dd>

    <dt id="homily">homily</dt>
    <dd role="definition" aria-labelledby="homily">a usually short sermon</dd>
    <dd role="definition" aria-labelledby="homily">a lecture or discourse on or of a moral theme</dd>
</dl>

然而，这种附加标记的实际用途非常小。大多数软件都忽略它。此外，如果列表已正确写入，“名称”和“值”之间的关联就足够明显，没有这样的标记。

Answer 2

据我所知 - <dd>是其前一个<dt>的定义。从技术上讲，每个<dd>不会有多个<dt>。做这样的事情：

<dl>
  <dt>happiness</dt>
  <dd>
    <span class="pronunciation">/'hæ p. nes/</span>
    <span class="definition">The state of being happy</span>
  </dd>
</dl>

然后相应地调整范围。

编辑：

道歉，正如大卫托马斯指出的那样，每<dd> <dt>（http://html5doctor.com/the-dl-element）可以有多个<dd>。我认为我在这里的主要想法是，如果将{{1}}分成上面的部分，我仍然认为它会更整洁，更容易设计风格。

描述列表：分组<dt>及其“子”</dt> <dd>？</dd>

2 个答案: