CSS：調整背景圖片，而不是切斷

我使用JavaScript作爲瀏覽器調整大小來調整一個div，並初步確定其頁面加載時。（是的，我知道它需要正常降級）。我無法通過CSS做這一切的原因是因爲與需要被考慮到屏幕的上方一定的高度固定的導航欄。我想調整DIV（和它的漸變背景），以適應瀏覽器窗口，但是當我更改CSS height屬性，它只是削減圖像關閉，而不是調整其大小，這意味着頁面的下一章節將無法正常過渡。有這個簡單的解決辦法嗎？CSS：調整背景圖片，而不是切斷

這是我現在使用的CSS：

#homepage_aboutstrip { 
     background-image:url('home/images/gradient-about-background.png'); 
     background-repeat:repeat-x; 
     position:absolute; 
     margin-top:0px; 
     width:100%; 
     height:1050px; 
     z-index:1; 
    }

並採用IMG標籤，而不是背景圖像顯然會工作，但它不是一個不錯的選擇。

來源

2013-04-21 Mr. Lavalamp

爲什麼不使用CSS3漸變？ – 2013-04-21 16:58:50

這是更有效的只使用一個輕量級的圖像在這種情況下，因爲梯度非常仔細地調整了。在一個完美的世界裏，我可能會利用這些漸變，但我們有一個堅持的時間表。 ;） – 2013-04-21 17:01:54

您可以使用單線CSS做。試試這個，如果它工作，如果它擴展了太多

來源

2013-04-21 16:54:53 Sikander

天使在唱歌，我的朋友。好吧，有點。它不適用於IE8，但至少這是一個步驟。謝謝！ – 2013-04-21 16:56:36

http://stackoverflow.com/questions/2991623/make-background-size-work-in-ie – cimmanon 2013-04-21 17:04:09

它爲我在IE7以及

background-image:url('home/images/gradient-about-background.png'); 
background-size: cover

圖像質量可能會受到干擾。

background: url(../img/url.jpg) no-repeat center center fixed; 
-webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
     background-size: cover; 
background-position: 0 40px; /* Only if you want clip out space for fixed navbar */

來源

2013-04-21 17:02:54

CSS：調整背景圖片，而不是切斷

回答

相關問題