Question

的最佳做法是什么

<dl>
    <dt>link title 1</dt>
    <dd>link description 1</dd>
    <dt>link title 2</dt>
    <dd>link description 2</dd>
</dl>

链接（？）：

<dl>
    <a href="#">
      <dt>link title 1</dt>
      <dd>link description 1</dd>
    </a>
    <a href="#">
      <dt>link title 2</dt>
      <dd>link description 2</dd>
    </a>
</dl>

或者您会使用<li>和<br>标签来实现类似的功能。

<ul>
    <li><a href="#">link title 1<br><span class="description">link description 1</span></a></li>
    <li><a href="#">link title 2<br><span class="description">link description 2</span></a></li>
</ul>

这是为了成为移动应用程序的一部分（通过手机间隙），任何帮助或见解都会很棒，谢谢。

Answer 1

您不应将a标记用作dl的直接子标记。 dd和dt标记用作直接子标记。所以，你可以使用：

<dl>
      <dt><a href="#">link title 1</a></dt>
      <dd><a href="#">link description 1</a></dd>

      <dt><a href="#">link title 2</a></dt>
      <dd><a href="#">link description 3</a></dd>
</dl>

这样就维持了html的标准。

Answer 2

如果您使用的是HTML5 doctype，那么您可以执行以下操作

<dl>
    <a href="#">
      <dt>link title 1</dt>
      <dd>link description 1</dd>
    </a>
    <a href="#">
      <dt>link title 2</dt>
      <dd>link description 3</dd>
    </a>
</dl>

但是，如果你不是，那么上面的胜利是有效的，因为dd是一个块级元素，并将它放在一个内联元素a内会导致你的HTML变为无效

链接定义列表（最佳实践）还是坏主意？

2 个答案: