背景調整到瀏覽器，不固定

我有一個網站，我正在做這需要一個背景調整大小。目前，我使用Supersized這樣的網站。但這個網站是獨一無二的。 Supersized的問題是它總是調整到全屏，並且是固定的背景。背景調整到瀏覽器，不固定

我正在尋找一個調整到瀏覽器的背景圖片，但不一定會填充它。

例如，如果我有600px x 600px的圖片，我希望它在瀏覽器寬度爲1200px的網站上調整至1200px x 1200px。即使網站的高度是1800px（滾動）。它保持在頁面的頂部（絕對定位，不固定）。因此，網站的1200px高度應該是圖片，網站底部剩餘的600px應該是無論身體的背景風格設置爲什麼。

這可能嗎？

來源

2012-03-23 Nicole

我相信你正在尋找的是css3屬性的背景大小。假設你想將背景圖片設置爲一個div，你將需要使該div的寬度和背景大小的100％，而背景圖片設置爲不重複：

#background_image { 
    width: 100%; 
    background: url('path/to/image.jpg') no-repeat red; 
    background-size: 100%; 
}

看看：http://jsfiddle.net/PgnvQ/

來源

2012-03-23 21:15:43 codybuell

正是我在找什麼，謝謝！ – Nicole 2012-03-23 22:15:46

background-size屬性是正確的，但我認爲關鍵字'cover'應該更適合。無論如何，這種方法的缺點 - 通常是缺少對IE <9的支持 – franzlorenzon 2013-03-13 08:26:12

背景調整到瀏覽器，不固定

回答

相關問題