背景圖像沒有完全伸展

我剛剛推出了一個網站，並認爲它沒有奇怪的CSS錯誤，但顯然它不是。我在這裏想要做的是拉伸圖像以適應頁面的高度和寬度。背景圖像沒有完全伸展

問題： 我有以下的標記：

<img src="images/night_sky7.jpg" class="stretch" />

下面CSS應用到它：

img.stretch { 
left: 0px; 
position: absolute; 
top: 0px; 
width: 100%; 
z-index: 0; 
}

這是工作在我的17.1' 筆記本電腦罰款1440分辨率，但我注意到它在其他屏幕分辨率下無法正常工作。會發生什麼是背景不會伸展到底部，而是低於底部甚至到頁面中間。

現在，我試着改變了很多CSS，但我無法讓它完全拉伸。

任何幫助表示讚賞。

你可以測試的網址是：http://bit.ly/eOEzXJ。

如果有必要，我可以做任何一件事：在Photoshop

2010-12-07 Evert

您可能要改寫這個。看起來你正在試圖讓一個元素的背景延伸，這是不能用CSS來完成的。 – meagar 2010-12-07 16:40:10

你不應該拉伸圖像，你應該總是使用背景重複，如果你想重複， – kobe 2010-12-07 16:47:51

試着這樣做：

body { 
    height: 100%; 
} 

img.stretch { 
    // your stuff 
    height: 100% 
}

我注意到你也有一個包裝CSS類。你想也需要補充一點：

#wrapper { 
    height: 100%; 
}

2010-12-07 16:39:08

Chuck的正確的軌道上，但是您可能需要添加

html { 
    height: 100%; 
}

爲好。

2010-12-07 16:41:12

你可能只想在HTML img標籤的高度和寬度設置爲100％

<img src="images/night_sky7.jpg" class="stretch" width="100%" height="100%"/>

2010-12-07 21:03:33 Kobby

回答