Question

所以我有一个下拉菜单，如下所示：

http://slypaste.org/KmsRuS4k

对不起这些链接，我从来没有运气过stackoverflow html系统..

所以下拉菜单的样式与下拉菜单上看起来很丑的按钮相同。我已经尝试在它的li风格中添加一个类，但它仍然无视它

这就是悬停颜色的原因。下拉列表中的bg：

http://slypaste.org/5Kxv43WS

我已经尝试了所有我知道的但仍然无效。

目的：

使菜单下拉颜色，链接看起来与其他菜单完全不同。

现场演示：

http://justxp.plutohost.net/testing/index.html

如你所见，基本上它取自菜单类的边框。

感谢。

Answer 1

你可以像上面评论中提到的jzacharia那样做：

<强> CSS

在CSS文件中，更改此内容：

.menu a
{
    ....
}

.menu a:hover
{
    ....
}

到此：

.menu a.title
{
    ....
}

.menu a.title:hover
{
    ....
}

<强> HTML

然后你的HTML应该是这样的：

<ul class="menu">
    <li class="current"><span style="color:#bde2e1;">Home</li>
    <li class="dropdown">
        <a id="drop4" role="button" data-toggle="dropdown" href="#" class="dropdown-toggle title">Dropdown <b class="caret"></b></a>
        <ul id="menu1" class="dropdown-menu" role="menu" aria-labelledby="drop4">
            <li><a tabindex="-1" href="#">Action</a></li>
            <li><a tabindex="-1" href="#">Another action</a></li>
            <li><a tabindex="-1" href="#">Something else here</a></li>
            <li class="divider"></li>
            <li><a tabindex="-1" href="#">Separated link</a></li>
        </ul>
    </li>
    <li class="hovering"><a href="#" class="title">Portfolio</a></li>
    <li class="hovering"><a href="#" class="title">Releases</a></li>
    <li class="hovering"><a href="#" class="title">Contact</a></li>
</ul>

Answer 2

.dropdown-menu a { 背景：无; }

.dropdown-menu{
    background-color: to what you want!
    padding:none;
}

.dropdown-menu a {
    color: to what you want!
}

.menu a {
    border-radius:none;
    box-shadow:none;
}

那会让你开始吗？

如何使某些类不影响类内部

2 个答案: