Twitter bootstrap 引导导航栏在小屏幕上变得透明

我是一个新的引导，并试图创建一个网页与响应导航栏。一切都按我所希望的那样工作，只是当屏幕变得足够小，使其成为可折叠列表时，导航栏变得透明。我已经搜索了Chrome inspector，但没有找到任何结果，并且尝试了我能想到的一切。有人有想法吗？

将这一行添加到css中：

.navbar{
  z-index: 2;
}

---

这个问题源于这样一个事实，即您的行内容是在导航之后创建的（在它前面也是如此），但您在单击时扩展了导航。为了避免这种情况，你只需要给你的导航设置一个比你的内容更大的z索引（默认为1）。

我也有同样的问题。只需更改scripts.js文件，或者如果您还没有这个文件，则将这行代码添加到scripts.js中。相应地将颜色更改为您喜欢的颜色

// Collapse Navbar
var navbarCollapse = function () {
    if ($("#mainNav").offset().top > 100) {
        $("#mainNav").addClass("navbar-shrink");
        //scroll more than 100 change background color
        //add the same for the else statement below instead of transparent if you dont 
        //want transparent color
        $("#mainNav").css("background-color", "#212529");
    } else {
        $("#mainNav").removeClass("navbar-shrink");
        //scroll less than 100 keep background color transparent
        $("#mainNav").css("background-color", "transparent");

    }
};

---

您需要编辑包含代码的问题，否则这将是一个很麻烦的问题。如果可能的话，请包括演示问题的最低代码量。好的，我会这样做。不过，我可能需要一段时间才能弄清楚。谢谢你的提示！非常感谢你。我做了z指数的实验，一定是做错了什么。。。我只在chrome inspector中使用了它。这是导航标签在页面内容上扩展或固定导航的常见问题。始终记住按标签放置的逻辑顺序签入。祝你的网站玩得开心！