html - 锚定在整个元素的矩形中

Question

我有一个由以下标记创建的列表

<ul class="menu">
    <li><a href="#">Bucuresti</a></li>
    <li><a href="#">Sighisoara</a></li>
    <li><a href="#">Tuzla</a></li>
    <li><a href="#">Comorova-Neptun</a></li>
    <li><a href="#">Maramures</a></li>
    <li><a href="#">Sinaia</a></li>
</ul>

我的问题是 anchor 仅对 a 创建的边界矩形有效标签，如下所示:

我想要的是整个 li 上的 anchor 标签。过去，我一直把 li在 anchor 标签(<a href="#"><li>Bucuresti</li></a>)内，但有人告诉我这是错误的。在不强制使用 HTML 语法的情况下，我还能做些什么来获得我想要的效果？

Answer 1

链接 ( <a> ) 是 inline elements默认情况下，它们占据了内容的宽度。通过将它们设置为 block level相反 ul.menu a {display:block;} ，默认情况下它们将占据其包含元素的整个宽度，您可以赋予它们扩展高度的能力。