Bootstrap header/jumbotron background image

Question

Я впервые общаюсь с Bootstrap и изо всех сил пытаюсь получить изображение в качестве фона для заголовка, в который вошли nav и jumbotron. В настоящее время изображение, которое я установил, не отображается, и я не знаю, почему. Если бы вы могли указать мне в правильном направлении относительно того, где или что нужно изменить, это будет оценено по достоинству.

<div class="container header-bg"> 
    <nav class="navbar" role="navigation"> 
     <div class="container"> 
      <div class="navbar-header"> 
       <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> 
       <span class="sr-only">Toggle navigation</span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
       </button> 
       <a class="navbar-brand" href="#">Elliott Davidson</a> 
      </div> 
      <div id="navbar" class="collapse navbar-collapse"> 
       <ul class="nav navbar-nav pull-right"> 
       <li><a href="#about">About</a></li> 
       <li><a href="#about">Pictures</a></li> 
       <li><a href="#about">Videos</a></li> 
       <li><a href="#about">Sponsors</a></li> 
       <li><a href="#about">Blog</a></li> 
       <li><a href="#contact">Contact</a></li> 
       </ul> 
      </div><!--/.nav-collapse --> 
     </div> 
    </nav> 
    <div class="jumbotron"> 
     <div class="container"> 
     <h1>Elliott Davidson</h1> 
     <p>This is a template for a simple marketing or informational website. It includes a large callout called a jumbotron and three supporting pieces of content. Use it as a starting point to create something more unique.</p> 
     <p><a class="btn btn-primary btn-lg" href="#" role="button">Learn more</a></p> 
     </div> 
    </div> 
</div> 

    .header-bg { 
     width:100%; 
     height:475px; 
     background: url("img/elliott-davidson-slider.jpg"); 
     background-size:cover; 
    } 

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

Answer 1

background: url("../img/elliott-davidson-slider.jpg"); 

К - Ерко Пальмы

Answer 2

Попробуйте добавить "фоновое изображение" как так:

.header-bg { 
    width:100%; 
    height:475px; 
    background-image: url("img/elliott-davidson-slider.jpg"); 
    background-size:cover; 
}