HTML：使圖像填滿屏幕，保留不同分辨率下的寬高比

Question

我在製作HTML頁面時遇到問題。具體來說，我想要一個特定大小的背景圖像（大於屏幕）;不過，我希望保持寬高比，並儘可能在屏幕上填充圖像（無平鋪）。

我也想能夠定位其他元素相對於背景圖像;背景是內容的一部分，我希望其他元素（例如文本）在瀏覽器窗口的任何分辨率下保持其在圖像中的位置。

有人可以給我一個解決方案嗎？我可以（顯然）使用HTML，CSS和JavaScript。如果找不到解決方案，我會將圖像製作爲800X600或1024x768並堅持該分辨率。我希望我不必訴諸於此。

編輯：我應該提到的是，backgound-size: contain;不能像預期的那樣工作。至少不適合我。

Answer 1

使用CSS背景大小值「包含」

body 
{ 
    background-image:url('smiley.gif'); 
    background-repeat:no-repeat; 
    background-size:contain; 
}