Twitter bootstrap 引导导航列表折叠悬停问题

我似乎无法使悬停功能正常运行，在导航列表中突出显示导航标题上的列表项，我也有一个折叠控件。注意nav标题项必须有一个指向页面的链接以及折叠控件，因此跨度

<ul class="nav nav-list">
<li class="nav-header">
    <span>
        <a href="/" title=""><i class="icon-home"></i>Home</a>
        <span class="caret pull-right" data-target="#test" data-toggle="collapse"></span>
    </span>
    <ul class="nav nav-list collapse in" id="test" >
        <li><a href="/ticket_list.cfm" title="Show list of tickets">Open Tickets</a></li>
        <li><a href="/account/" title="Edit user accounts">Accounts / Community</a></li>
    </ul>
</li>
</ul>

有什么想法吗

谢谢。

该标记阻止突出显示效果，因为控制这些样式的选择器是.nav list>li>a和.nav list>li>a:hover。 因此，您可以调整标记或使用符合您需要的选择器复制该样式。

该标记阻止突出显示效果，因为控制这些样式的选择器是.nav list>li>a和.nav list>li>a：悬停。

---

因此，您可以调整标记或使用符合您需要的选择器复制样式。

我刚刚遇到了相同的问题，悬停样式在包含标记的导航列表中不起作用。除了原始帖子提出的问题外，如果您包含一个。我对awjr得到的css进行了扩展，得到了这个处理class=active案例的版本

这是正在工作的jsfiddle

---

我刚刚遇到了相同的问题，悬停样式在包含。除了原始帖子提出的问题外，如果您包含一个。我对awjr得到的css进行了扩展，得到了这个处理class=active案例的版本

这是正在工作的jsfiddle

---

在chrome上它似乎工作得很好。在chrome上它似乎工作得很好。感谢上面的css修复了这个问题：.nav>li>span:hover{text decoration:none；background color:EEE；}.nav>li>span{display:block；}.nav list>li>span>a{text decoration:none；}.nav list>li>span>{margin right:-15px；margin left:-15px；文本阴影：0 1px 0 rgba255，255，255，0.5；}.nav list>li>span{padding:3px 15px；}​感谢上面的内容，以下css修复了这个问题：.nav>li>span:hover{text decoration:none；背景色：EEE；}.nav>li>span{display:block；}.nav list>li>span>a{text decorcoration:none；}.nav list>li>span{margin right:-15px；margin left:-15px；文本阴影：0 1px 0 rgba255，255，0.5；}.nav list>li>span{padding:3px 15px；}​

/* fix bootsrap nav-list containing a span */
.nav > li > span:hover {
    text-decoration: none;
    background-color: #EEE;
}
.nav-list > .active > span, .nav-list > .active > span:hover, .nav-list > .active > span:focus {
    text-decoration: none;
    background-color: #0088cc;
}
.nav-list > .active > span > a {
    color: #ffffff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
}
.nav > li > span {
    display: block;
}
.nav-list > li > span > a {
    text-decoration: none;
}
.nav-list > li > span {
    margin-right: -15px;
    margin-left: -15px;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}
.nav-list > li > span {
    padding: 3px 15px;
}