本文介绍了如何获取Twitter Bootstraps移动导航栏覆盖页面上的内容,而不是推下来?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用Twitter Bootstrap,并且想要修改移动导航栏,以便在展开时,下拉菜单覆盖页面上的内容,而不是将其下推。我知道我可能需要使菜单包含< div> 绝对定位,增加它的z索引,并将外部< div> ;

I'm using Twitter Bootstrap and would like to modify the mobile navbar so that when it is expanded the dropdown menu overlays the content on the page instead of pushing it down. I know I will probably need to make the menu containing <div> positioned absolutely, increase it's z-index, and position the outer <div> relatively, but I can't seem to get it to work.

有关如何做的建议吗?

这是我从开始。

推荐答案

如果您在navbar中添加类 navbar-absolute

If you add a class like navbar-absolute to your navbar:

<div class="navbar navbar-fixed-top navbar-absolute">...</div>

和一些CSS规则:

@media (max-width: 979px) {
  .navbar-fixed-top.navbar-absolute {
    position: absolute;
    margin: 0;
  }
}

.navbar-absolute + div {
    margin-top: 68px;
}

它应该让你开始。

这篇关于如何获取Twitter Bootstraps移动导航栏覆盖页面上的内容,而不是推下来?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

10-29 14:23