CSS3 Background Future

在 JaceJu 的噗浪上看到 CSS3 background 新的特性，可以讓瀏覽器控制背景圖片的一些屬性，頗好用的。

CSS3 Backgrounds of the Future
http://www.andismith.com/blog/2012/02/css-backgrounds-of-the-future/

設定背景圖片：

body {
   backgroud: bg.jpg;  /* 1024x768 */
}

以上的設定，當視窗大小如你預期相同時，畫面便會與最初的設計相同，但若視窗較大或較小，都可能會讓畫面走樣。

加上 background-size 屬性，讓瀏覽器決定圖片的大小：

body {
   backgroud: bg.jpg;
   background-size: contain; 
}

修改之後，背景圖片便會依照視窗大小做調整。