html - 如何最好地构建一个考虑到可访问性的定义列表

Question

我有一个 dl，我的代码是这样的:

<dl>
  <dt>term 1</dt>
    <dd>definition 1</dd>
  <dt>term 2</dt>
    <dd>definition 2</dd>
  <dt>term 3</dt>
    <dd>definition 3</dd>
</dl>

我发现很难为我想要的布局应用正确的 CSS。列中的每个术语和定义。按照以下方式构建 html 可以解决我的问题，但我想知道，这样可以吗？ (从可访问性的 Angular 来看)。

<dl>
    <dt>term 1</dt>
    <dd>definition 1</dd>
</dl>
<dl>
    <dt>term 2</dt>
    <dd>definition 2</dd>
</dl>
<dl>
    <dt>term 3</dt>
    <dd>definition 3</dd>
</dl>

Answer 1

将每个术语放在其自己的列表中使得无法以编程方式确定这三个术语实际上彼此相关(因为它们是您网站上相同内容的一部分)。有时偏离标准当然是必要的，但您没有说任何话来证明这是必要的。

如果您最初的潜在问题是“我无法按照我想要的方式设置此列表的样式”，那么 Stack Overflow 的一个更好的问题可能是:“我如何设置此列表的样式使其看起来像__。”