背景颜色在整个ul的宽度上延伸

Question

我有一个简单的列表,我用于水平菜单:

<ul>
    <h1>Menu</h1>
    <li>
      <a href="/" class="selected">Home</a>
    </li>
    <li>
      <a href="/Home">Forum</a>
    </li>
</ul>

当我为所选类添加背景颜色时,只有文本获得颜色,我希望它拉伸该部分的整个距离.

希望这是有道理的.

Answer 1

a元素是内联元素,这意味着它仅适用于它所包含的文本.如果希望背景颜色水平拉伸,请将选定的类应用于块级元素.将类应用于li元素应该可以正常工作.

或者,您可以将其添加到选定的类'CSS:

display: block;

这将使元素显示为块元素.