如何停止空白空間重複的背景圖像？

剛剛遇到重複背景圖像的問題。如何停止空白空間重複的背景圖像？

當內容非常短，比監視器高度短時，背景圖像仍然在重複額外的空間。

請參考截圖。

桔子酒吧是我的頁腳。底部灰色區域是額外的空間。

我可以停止重複底部區域的背景圖像嗎？

我的意思是，只要我的內容只是重複背景圖像。

任何幫助將不勝感激。

My Image 。

來源

2012-09-26 Aaroninau

你能提供的代碼？您似乎可以將背景圖像提供給內容本身。 – UniAvenger

@UniAvenger我同意。我從圖片中假定背景圖像正在提供給身體而不是內容。你的解決方案應該解決這個問題但是源代碼會有幫助。 –

而不是堅持背景在身體上，在那裏拍另一格，並把背景到這一點。內容將推動div到正確的高度，並在該點停止（除非另有說明）。

如：

<!doctype html> 
<html> 
<body> 
    <div id="background"> 
     Your inner content 
    </div>  
</body> 
</html>

，並把你的重複背景到#background在你的CSS，而不是你的身體。

來源

2012-09-26 05:34:56 danielsan

您可以使用下面的屬性。

background-repeat:no-repeat;

欲瞭解更多信息，請通過這個site

你也可以給repeat-y或repeat-x使背景圖像重複垂直或水平分別。

如果你想給的尺寸，以你的背景圖片，然後你可以使用

background-size:100px 100px; /* width height */

我覺得這是你的意思。

來源

2012-09-26 04:21:00

您可以使用下面的屬性。

背景：無重複; 或同一行你可以使用圖像和不重複背景：＃00ff00 url（'smiley.gif'）無重複固定中心; 或 background-repeat：no-repeat;

欲瞭解更多信息，請通過本網站

你也可以給重複-y或重複-X，使背景圖像重複垂直或水平分別。

如果你想給的尺寸，以你的背景圖片，然後你可以使用

背景尺寸：100像素100像素;/* width height */ 我認爲這是你的意思。你也可以去 http://www.w3schools.com/cssref/css3_pr_background.asp http://www.w3schools.com/css/css_background.asp

來源

2012-09-26 04:36:52 vijay

夥計w3schools糟透了..永遠不會去那個網站。隨時與MDN一起。 –

我不介意，即使你複製我的答案:) –

這將是很好，如果你可以在這裏發表您的代碼。

嘗試是這樣的：

<div>  
<div> 
    <div style="float:left;"></div> 
    <div style="float:left;"></div> 
    <div style="clear:both"></div> 
</div> 
<div class="footer"></div> 
</div>

來源

2012-09-26 10:12:45

如何停止空白空間重複的背景圖像？

回答

相關問題