html - 我可以在 <li> 周围的 <ul> 中使用 <a> 吗

Question

我得到了以下代码:

<ul> 
     <a href="./index.php?profile=User1">
        <li>User1 : 16</li>
     </a>
     <a href="./index.php?profile=User2">
        <li>User2 : 4</li>
    </a>
</ul>

这在所有主流浏览器中都工作得很好，但它是不允许的/无效的 HTML，正确的方法应该是这样的:

<ul>
    <li> 
        <a href="./index.php?profile=User1">User1 : 16</a>
    </li>
    <li> 
        <a href="./index.php?profile=User2">User2 : 4</a>
    </li>
</ul>

但是如果我像第二个例子那样做，只有文本而不是整个 <li>像我想要的那样可以点击。
我应该继续使用无效的工作版本还是有更好的解决方案？

Answer 1

使用 CSS 使链接占据整个列表项，例如。 display: block(以及您可能需要的任何其他样式)。

环绕列表项的链接是无效的 HTML。