1

假设我有一个带有链接的导航栏:

           <div class="navbar-inner navlinks">
                <ul class="nav">
                    <li><a class="brand" href="#"><img src="img/logo.png" /></a></li>
                    <li> <a href="#">Accueil</a></li>
                    <li> <a href="#">Ouvrez</a></li>
                    <li> <a href="#">Decouvrir</a></li>
                </ul>
            </div>

这是使用 Twitter Bootstraps 制作的,因此链接位于导航栏容器内,并且都作为块元素向左浮动,正如您在典型导航栏中看到的那样。整个导航栏的背景颜色为我navlinks班级中定义的蓝色。它的高度明显高于链接的文本。

我想要的是链接在悬停时更改其整个“区域”的背景颜色。现在,当我添加悬停选项和背景颜色更改时,它只会更改链接所在文本上方的背景区域,这几乎不会引起注意。我希望它还可以更改下一个链接之前文本上方、下方和右侧的空间颜色。我认为 twitter 将其视为块元素会做到这一点,但它似乎不起作用。

4

2 回答 2

1

或者,您可以通过将填充添加到“a”标签而不是“li”来定义导航的高度,然后使用常规的#menu a:hover。

于 2013-02-22T17:34:09.497 回答
1

我不确定您真正要问的是什么,但是如果您要向锚点添加悬停,a:hover也许您只需要在链接上使用悬停li:hover{}

于 2013-02-22T17:10:14.880 回答