我正在使用ZURB Foundation Topbar,除了发现的错误之外,我都喜欢它。在第二级下拉菜单中,如果高亮显示然后单击链接(li元素),则它会带您到您单击的页面,活动的高亮显示将跳至上述元素之一并返回。

--- [之所以跳到上述元素之一,是因为它是要选择的第一级下拉菜单,出于某种原因,它跳到了前一级的下拉菜单,然后返回了第二级选择] ---仍然不知道要修复它。



   <!-- Nav Section Mobile-->
   <div class="top-bar-container hide-for-large-up">
   <nav class="top-bar">
   <ul class="title-area">
      <li class="name"></li>
      <li class="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a></li>
   </ul>
<section class="top-bar-section">
<!-- Nav Section -->
 <ul class="">
    <li class="divider hide-for-small"></li>
    <li class=""><a title="" href="/page.html">page</a></li>
    <li class="divider hide-for-small"></li>
    <li class=""><a title="" href="/page.html">page</a></li>
    <li class="divider hide-for-small"></li>
    <li class=""><a title="" href="/page.html">page</a></li>
    <li class="divider hide-for-small"></li>

    <li class="has-dropdown"><a href="#">pages</a>
      <ul class="dropdown">
        <li class="divider hide-for-small"></li>
        <li><a href="/page.html" >page</a></li>
        <li><a href="/page.html" >page</a></li>
        <li><a href="/page.html">page</a></li>
        <li><a href="/page.html">page</a></li>
        <li><a href="/page.html">page</a></li>
        <li><a href="/page.html">page</a></li>
      </ul>
    <li class="divider hide-for-small"></li>
    <li class="has-dropdown"><a href="#">More</a>
      <ul class="dropdown">
        <li class="divider hide-for-small"></li>
        <li><a href="/page.html">page</a></li>
        <li><a href="/page.html">page</a></li>
        <li><a href="/page.html">page</a></li>
      </ul>
    <li class="divider hide-for-small"></li>
  </ul>
</section>
  </nav>
</div>

最佳答案

在Foundation 4中,存在一个错误,因为伪类与冒号:一起使用。在.之后应该是一个句点li

.top-bar-section ul li:hover > a {


它应显示为:

.top-bar-section ul li.hover > a {


马上解决

08-25 16:28
查看更多