如何複製此背景圖片效果？

使用此示例：http://www.meridianapps.com/如何複製此背景圖片效果？

我喜歡在打開瀏覽器時擴大和擴大背景圖片的方式。但如果您嘗試最小化瀏覽器，它也有一個最小寬度。

我想重複這一點。有人可以指向我插入或代碼，我可以用來插入這樣的東西到我的網站？

2013-05-16 Gregg

查看源採取這一

html { background: url(images/bg.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }

看看。 – woz

他們正在使用哪個background-size: cover;縮放的背景圖像是

...儘可能小，同時確保它的兩個尺寸大於或等於所述背景定位區域的相應的尺寸。

Here are the docs from Mozilla.

該屬性應根據Can I use...在任何瀏覽器可用，除了IE8。

來源

2013-05-16 17:17:59 woz

謝謝你，我不知道這個CSS屬性 – Gregg

真棒，簡單，漸進的CSS3方式 我們可以純粹通過CSS來完成此操作，這要歸功於CSS3中的background-size屬性。我們將使用html元素（比body更好，因爲它總是至少是瀏覽器窗口的高度）。我們在它上面設置了一個固定和居中的背景，然後使用背景大小設置爲封面關鍵字來調整它的大小。嘗試從here

來源

2013-05-16 17:18:17

如何複製此背景圖片效果？

回答

相關問題