Jumbotron背景圖片

我已經嘗試了一切，到處搜索。但似乎沒有任何工作。這是一個很容易解決的問題，我想，我只是沒有單獨到達那裏。Jumbotron背景圖片

我想在我的jumbotron上設置一個背景圖像，因爲我使用的是引導程序。

這是我做的。

<div class="jumbotron center " > <!-- start jumbotron --> 

    <div class="container"> 

    <div class="jb-text"> 
     <h1>This is an epic service</h1> 
     <h3>Not really, just trying this thing out</h3> 
    </div> 

    <button class="btn btn-default" id="btn-custom"><a href="#">Start Your  <strong>Free</strong> Trial</a></button> 

    </div> <!-- end container --> 

</div> <!-- end jumbotron -->

這是CSS

.jumbotron{ 
    background-image: url('image/green-forest.jpg') no-repeat center center; 

}

遺憾的是沒有任何反應。

我覺得這是一個noob，但我是新手。

我向那，

埃德

來源

2014-09-22 Luis Valdez

的問題是，你已經使用background-image代替background財產。

來源

2014-09-22 23:59:02 emmanuel

是的！真奇怪。我做錯了什麼，但我無法弄清楚。 – 2014-09-23 00:15:19

你用瀏覽器檢查圖片是否正確加載？ – emmanuel 2014-09-23 00:22:13

是的，謝謝你的隊友。這有幫助。問題是我使用較少和CSS輸出是不同的，我的想法，所以我的網址是不正確的。這樣的noob。非常感謝您的支持伴侶。感謝 – 2014-09-23 00:35:29

很可能兩件事情的組合：

首先，您所指定的background-image屬性。如果你還沒有添加其他屬性，這也可以。所以你應該在這裏使用background屬性 - 就像在前面的答案中一樣。
接下來，您的jumbotron風格是否實際適用也取決於您在頁面中加載CSS文件的其他風格。如果您在之前加載您的CSS文件Bootstrap CSS，則Bootstrap CSS文件中的樣式可能會覆蓋您的樣式。在這種情況下，您的樣式將不適用。所以你應該在之後加載你的特定CSS文件Bootstrap CSS文件被加載。

來源

2014-11-22 18:11:31 aahoogendoorn

我只是有同樣的問題。由於我的CSS文件被包含在一個樣式表文件夾中，我存儲的圖像在不同的文件夾，我不得不將其更改爲：

.jumbotron{ 
    background-image: url('../image/green-forest.jpg') no-repeat center center; 
}

這是因爲你的URL是相對於你的CSS文件的位置，不你的HTML文件。

來源

2015-06-11 17:59:06

.jumbotron{ 
    background-image: url(../image/green-forest.jpg); }

請嘗試此代碼爲您的圖像設置爲超大屏幕的類。

來源

2017-09-11 21:09:02 SAM96

請嘗試上面的代碼段...我已經完成了編輯。 – SAM96 2017-09-11 21:31:53

它現在肯定會工作。 – SAM96 2017-09-11 21:32:20

Jumbotron背景圖片

回答

相關問題