在wordpress中粘贴bootstrap菜单

Question

我在Wordpress中有这个菜单（它基于bootstrap），我希望它在滚动时坚持到顶部，但在菜单上有一些内容：

图像： 代码：

<div class="menu-wrapper">
<div class="container">
<div class="row">
<div class="col-lg-3">
<a class="navbar-brand" href="https://x">
<img src="logo" alt="Logo" class="img-responsive" title=" Logo">
</a>
</div>
<div class="col-lg-9">
<nav id="site-navigation" class="main-navigation text-right" role="navigation">
<div class="menu-menu-1-container"><ul id="primary-menu" class="menu"><li id="menu-item-8" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-8"><a href="http://x">Link</a></li>
<li id="menu-item-14" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-14"><a href="http://x">Link</a></li>
<li id="menu-item-13" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-13"><a href="http://x">Link</a></li>
<li id="menu-item-12" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-12"><a href="http://x">Link</a></li>
<li id="menu-item-11" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-11"><a href="http://x">Link</a></li>
<li id="menu-item-10" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-10"><a href="http://x">Link</a></li>
</ul></div>                     </nav><!-- #site-navigation -->
<nav id="mobile-navigation" class="text-center" role="navigation">
<div id="mobile-menu-trigger">
<span></span>
<span></span>
<span></span>
</div>
<div class="menu-menu-1-container"><ul id="mobile-menu" class="menu"><li class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-8"><a href="http://x">Link</a></li>
<li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-14"><a href="http://x">Link</a></li>
<li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-13"><a href="http://x">Link</a></li>
<li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-12"><a href="http://x">Link</a></li>
<li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-11"><a href="http://x">Link</a></li>
<li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-10"><a href="http://x">Link</a></li>
</ul></div>                     </nav><!-- #site-navigation -->
</div>
</div>
</div>
</div>

Answer 1

由于您使用的是引导程序，因此可以将其“navbar-fixed-top”类添加到菜单中。您可以看到here

的使用示例

如果您只需要在其他内容的基础上正确显示已经附加的菜单 - 只需使用CSS z-index：

.menu-wrapper {
  z-index:99999;
}

UPD：使用this pattern在滚动中添加类