css完美的全屏圖像背景

我想知道哪個背景圖像適合每個屏幕，每個瀏覽器的最佳解決方案。另外我注意到，大多數技術都會使圖像產生一點點影響。我知道有很多技術可以做到這一點，但我想知道哪些是你認爲最好的。謝謝！css完美的全屏圖像背景

2011-08-31 alexandru

我不要認爲真的有所有解決方案。您的解決方案將很大程度上取決於您的圖像的外觀和應用方式。例如，許多背景圖像在圖像中心的內容區域寬度上留下很大的空隙。而其他背景圖像通過內容區域顯示。一些重複。背景圖像有幾種技術，但根據設計的不同而不同。 – Jrod

http://css-tricks.com/3458-perfect-full-page-background-image/ - jquery方法 - 可能是最好的解決方案。 – easwee

這post from CSS-tricks.com涵蓋了全屏幕背景圖像的不同技術，幷包括老版本的IE（我還沒有測試IE修復）的退步。

當我不需要擔心支持舊的瀏覽器，我一般使用CSS3方法：

html { 
    background: url(http://lorempixum.com/1440/900/sports) 
     no-repeat center center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
}

來源

2011-08-31 15:24:10 DuMaurier

我知道，方式老，但是有沒有一個好的替代方案，不會隨瀏覽器調整大小？希望我能給出一個最小高度的圖像 –

添加這個身體標記內：

<img src="img/beach.jpg" 

style="width:100%;height:100%;position:absolute;top:0;left:0;z-index:-5000;">

http://thewebthought.blogspot.com/2010/10/css-making-background-image-fit-any.htmlg

來源

2014-09-25 09:03:23

css完美的全屏圖像背景

回答

相關問題