Bootstrap header/jumbotron背景圖片

我第一次使用Bootstrap搞亂了圖像，並且努力得到一個圖像作爲包含nav和jumbotron的標題的背景。目前我設定的圖像沒有顯示，我不知道爲什麼。如果您可以指出我需要改變的地方或需要改變的方向，我們將不勝感激。Bootstrap header/jumbotron背景圖片

enter image description here

<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; 
    }

來源

2015-02-23 Elliott Davidson

什麼是你目前的問題？你說了你想要的，但它會幫助，如果你說你現在正在得到什麼 – 2015-02-23 17:43:43

圖像不顯示對不起，將更新發布 – 2015-02-23 17:44:37

一個屏幕截圖也會很好 – 2015-02-23 17:45:25

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

通過 - Yerko繪製帕爾馬

來源

2015-02-24 11:55:53

嘗試增加「背景圖片」，例如：

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

來源

2015-02-23 17:49:10 jph

不幸的是，它沒有奏效。 – 2015-02-23 17:50:38

Bootstrap header/jumbotron背景圖片

回答

相關問題