⚙️ 工程

关于 <dl> 元素的隐藏细节On the <dl>

simonwillison.net·2026-05-23 节选正文

Ben Meyer 的文章揭示了 HTML `<dl>` 元素四个鲜为人知的功能：`<dt>` 后可跟多个 `<dd>`；可用 `<div>` 包裹 `<dt>`/`<dd>` 组进行样式控制；支持 ARIA 标签；以及历史演变。这些特性常被开发者忽略，但能提升语义化和可访问性。

阅读原文

Simon Willison

23rd May 2026 - Link Blog

On the <dl> (via) I learned a few new-to-me things about the <dl> element from this article by Ben Meyer:

A <dt> can be followed by multiple <dd>

You can optionally group the <dt> and <dd> elements in a <div> for styling - but only a <div>.

You can label them using ARIA.

They've been called "description lists", not "definition lists", since an HTML5 draft in 2008.

So this is valid:

<h2 id="credits">Credits</h2>
<dl aria-labelledby="credits">
  <div>
    <dt>Author</dt>
    <dd>Jeffrey Zeldman</dd>
    <dd>Ethan Marcotte</dd>
  </div>
</dl>

Here's a useful note from Adrian Roselli on screen reader support for description lists.

需要完整排版与评论请前往来源站点阅读。