爲什麼我不能設置背景圖像？

我剛開始編碼，我正在用bootstrap構建一個網站。我想用背景圖像創建一個簡單的Container（id =「test」）。我不知道爲什麼，但我只是沒有設置背景圖像，我沒有想法。我也在使用外部CSS。我剛發現摺疊按鈕不起作用。請幫我解決這兩個問題。爲什麼我不能設置背景圖像？

問候，

約翰內斯Getzner

HTML：

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="utf-8"> 
<meta http-equiv="X-UA-Compatible" content="IE=edge"> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
<link rel="stylesheet" type="text/css" href="MyStyle.css"></link> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"> </script> 
<script src="js/bootstrap.min.js"></script> 
<link href="css/bootstrap.min.css" rel="stylesheet"> 
<title>FirstWebsite</title> 

</head> 

<body> 
<div id="wrapper"> 
    <div class="navbar navbar-default"> 
     <div id="container"> 
      <div class="navbar-header"> 
       <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> 
       </button> 
       <a id="brand" class="navbar-brand">Example</a> 
      </div> 
      <div class="collapse navbar-collapse"> 
       <ul id="listleft" class="nav navbar-nav navbar-left"> 
        <li><a href="#Home">Home</a></li> 
        <li><a href="#About">About</a></li> 
       </ul> 
       <ul id="listright" class="nav navbar-nav navbar-right"> 
        <li><a href="#Contact">Contact</a></li> 
        <li><a href="#Blog">Blog</a></li> 
       </ul> 
      </div> 
     </div> 
    </div> 
    <div id="test"> 

    </div> 
</div> 
</body> 
</html>

CSS

#brand{ 
font-size: 300%; 
} 
.navbar-brand{ 
position:absolute; 
width: 100%; 
left: 0; 
top: 0; 
text-align: center; 
margin: auto; 
} 
#listleft{ 
margin-left: 20%; 
} 
#listright{ 
margin-right: 20%; 
} 

ul li{ 
font-size: 100%; 
} 

#test{background-image: url("background2.jpg"); 

}

來源

2015-11-05 Johannes Getzner

是你的背景圖片的路徑是否正確？ – j08691

爲你的'#test {background-image：url（「background2.jpg」）;'增加圖片的高度ident高度 –

通常div沒有內容沒有大小，圖片可能會顯示，但div中沒有空格看見了。嘗試設置寬度/高度。 –

選擇風格鏈接的head

訂單

來源

2015-11-05 19:44:04 Alex

謝謝你的工作，但爲什麼這很重要？ –

最後的風格有更多的優先權，因此引導超過了你的風格。請接受我的回答，如果它有幫助。 – Alex

@alirezasafian等等，bootstrap css是否包含#test的規則？ –

你的CSS看起來好像可能沒問題，但看起來你並沒有在那個空的div上設置高度或寬度。可能你會得到一個0像素×0像素的空白div，其背景爲

來源

2015-11-05 19:47:17 wesww

id =「test」的div沒有任何內容;因此它沒有高度。所以無論你給它的背景都不會出現。

解決方案：在CSS中給div一個高度。

#test { 
    background-image: url("background2.jpg"); 
    height: 100px; /* or whatever */ 
}

（或者，把東西在div，如文本什麼的。）

來源

2015-11-05 19:48:02

爲什麼我不能設置背景圖像？

回答

相關問題