背景覆盖在引导

Question

我的代码我的超大屏幕：

<!-- Navbar --> 
<nav class="navbar navbar-fixed-top" id="my-navbar"> 
    <div class="container"> 
     <div class="navbar-header"> 
     <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse"> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
     </button> 
     <a href="" class="navbar-brand"><img style="max-width:100px; margin-top: -7px;" src="images/firma-Edgar-Ayales.png" alt=""></a> 
     </div> 
     <!--End navbar-header--> 
     <div class="collapse navbar-collapse navbar-right" id="navbar-collapse"> 
     <ul class="nav navbar-nav"> 
      <li><a href="#portfolio">Feedback</a> 
      <li><a href="#features">Gallery</a> 
      <li><a href="#gallery">Features</a> 
      <li><a href="#feedback">Faq</a> 
      <li><a href="#contact">ContactUs</a> 
     </ul> 
     </div> 
     <div> 
     </div> 
    </div> 
    <!-- End container --> 
</nav><!-- End navbar --> 

<div class="jumbotron"> 
    <div class="container"> 
     <h1>Transformamos tus ideas en atractivos diseños</h1> 
    </div> 
</div> 

文字越来越背景后面。我想让我的网页的第一部分成为背景，包括导航栏。 CSS是：

.navbar { 
    background: rgba(0, 0, 0, 0); 
    font-size: 10pt; 
    text-transform: uppercase; 
} 

.navbar-nav > li > a { 
    color: white; 
    font-family: "Tahoma", sans-serif; 
    font-weight: bold; 
} 

#my-navbar { 
    background: url(images/bgfix.jpg) no-repeat; 
    height: 700px; 
    background-size: cover; 
    background-position: center; 
    position: absolute; 
} 

#titulobg { 
    text-align: center; 
    padding-top: 450px; 
    color: black; 
    font-family: "Nunito", sans-serif; 
} 

.jumbotron { 
    color: white; 
    text-shadow: black 0.3em 0.3em 0.3em; 
    background: transparent; 
} 

此外，当我尝试添加一个新的div来添加文本，它会背后的背景。

Answer 1

我假设你从“navbar”扩展“my-navbar”。它继承了所有navbar的属性，包括一个高z-索引。 z-index只是告诉浏览器什么重叠。低Z指数用于背景，高Z指数用于前景。

#my-navbar{ 
    background:url(images/bgfix.jpg) no-repeat; 
     height: 700px; 
     background-size: cover; 
     background-position: center; 
     position: absolute; 
     z-index: -1; 
    } 

编辑： 用相对位置来

#my-navbar{ 
     background:url(images/bgfix.jpg) no-repeat; 
      height: 700px; 
      background-size: cover; 
      background-position: center; 
      position: relative; 
      z-index: -1; 
     } 

编辑2：为了在顶部取出烦人白色绝对巴。

body { 
    padding-top: 0px; 
}