background-size屬性的幾個實用的值

先來看w3c的background-size的幾個值：

 background-size:cover;    把背景圖像擴展至足夠大，以使背景圖像徹底覆蓋背景區域。背景圖像的某些部分也許沒法顯示在背景定位區域中。

 background-size:contain;  把圖像圖像擴展至最大尺寸，以使其寬度和高度徹底適應內容區域。

在項目中常常會使用一張背景圖看成網頁背景，我一直使用的是 background-size:cover; cover這個值是使背景圖鋪滿全屏，可是背景圖片可能顯示不徹底。

後來發現 background-size:100% 100%;  能夠使圖片鋪滿全屏而且使背景圖片顯示徹底（蕩然不一樣屏幕下背景圖片會被拉伸或縮小），這個值相對於cover來講，更適合用來設置全屏背景，尤爲是自適應寬高的網頁中。

還有個 background-size:contain;  這個就是把背景圖等比例縮放,儘可能適應屏幕。