有背景圖像「伸展以適合」我的頁面的背景

我有一個圖像我想用作背景圖像，但我需要它的高度來適應從頁眉到頁腳的100％，然後我可以放棄背景顏色：黑色;在它後面使它完美。有背景圖像「伸展以適合」我的頁面的背景

有沒有辦法做到這一點？目前，我嘗試使用這個CSS：

#wrapper .bg{ 
    background: url(../images/sky.png) no-repeat; 
    position:absolute; 
    top:0; 
    left:0; 
    width:100%; 
    height:100%; 
    display:block; 
    z-index:-1; 
}

這最終留下的形象和頁腳，我猜測，如同在拍攝是不存在相同數量之間的一些空間。

來源

2012-03-11 Silas

邊注：通常你不希望你的背景延伸，因爲這降低了顯示圖像的質量（分辨率不同） – 2012-03-11 08:24:22

非常相似：http://stackoverflow.com/questions/4379084/background-圖像不伸展完全 – 2012-03-11 08:28:09

這是令人毛骨悚然的諷刺，我使用的圖像是在這樣一個高分辨率，質量沒有退化，但謝謝你的未來努力 – Silas 2012-03-11 08:38:56

不，你需要做的是在體內添加一個圖像標籤，並將高度設置爲100％。應用任何Z-index調整與CSS，所以它仍然是你的內容。

來源

2012-03-11 08:26:00 AlienWebguy

如果您不支持舊瀏覽器，則可以使用css3來實現此目的。

body { 
    background-image: url(myimage.png); 
    background-size: cover; 
}

來源

2012-03-11 16:27:11

這對於我自己在chrome32，ff26和ie10中都有效。謝謝！ – 2014-02-08 02:02:27

應該被接受爲答案... – 2014-02-16 03:14:16

有背景圖像「伸展以適合」我的頁面的背景

回答

相關問題