css3＆html5中的背景覆蓋

我無法使用css3 & html5來獲取漸變.jpg圖片（在PhotoShop中創建）來覆蓋整個頁面。我已經閱讀並嘗試了所有可以找到的效果，或者「修復」完全刪除了背景圖片。下面是代碼，我已經嘗試了許多不同的解決方案，其中包括w3schools.com，那我可能缺少明顯的（我希望）：css3＆html5中的背景覆蓋

@charset "UTF-8"; 
#main_container { 
display: block;  
clear: both;  
overflow: hidden; 
width: 960px; 
height: 100%; 
margin-right: auto;  
margin-left: auto; 
box-shadow: 0px 5px 10x 0px #362819;  
background:#738A7A;  
text-align: justify;  
text-align: left; 
border: 5px double #99AFA3; 
} 
body { 
font-family:Tahoma,"Century Gothic","Lucida Grande";  
font-size: 1.1em; 
font-weight:bold; 
line-height:1.5em; 
padding:0px;  
margin-bottom:15px;  
background-color: #587056; 
background-image: url('img/bkg.jpg'); 
background-size:cover; 
} 
#header { 
text-align: center;  
width: 960px; 
} 
#container {  
line-height: 1.5em;  
text-align:left;  
color: #331100;  
border: 4px ridge #587056; 
padding: 8px; 
margin: 8px;  
width: 60%;  
float: left; 
}

感謝您的任何幫助。

來源

2013-04-08 Linda

您也需要到後臺應用到html元素，或添加height:100%您body（但後一種情況下才會正常工作，如果你也有margin:0有）

來源

2013-04-08 18:01:06

謝謝你，我嘗試添加「保證金： 0px; height：100％;「沒有任何效果，給Css – Linda 2013-04-08 18:24:21

我剛剛嘗試在html5中添加，在css中刪除了後臺代碼，沒有任何效果。在這一點上，我所能想到的只是讓圖像變得更長，但我真的很喜歡它，並且在Css中完成它。還嘗試添加溢出：「隱藏」;也沒有效果。 – Linda 2013-04-08 18:34:50

它是固定的，但不知道爲什麼：#main_container { \t display：block; \t明確：均; \t溢出：隱藏; \t width：960px; \t身高：100％; \t padding：0px; \t margin-right：auto; \t margin-left：auto; \t border：5px double＃99AFA3; \t背景：＃738A7A; \t text-align：justify; } body { \t font-family：Tahoma，「世紀哥特式」，「Lucida Grande」; \t font-size：1.1em; \t font-weight：bold; \t line-height：1.5em; \t padding：0px; \t margin：0px; \t margin-bottom：15px; \t background-color：＃587056; \t background-image：url（'img/bkg.jpg'）; \t background-size：cover; \t溢出：隱藏; \t身高：100％; \t background-repeat：repeat-x; } – Linda 2013-04-08 19:17:56

css3＆html5中的背景覆蓋

回答

相關問題