今天要解決一個用背景圖以拉伸方式（不重複）填充背景的問題。
看了《用CSS把背景圖檔拉伸》和《css 如何讓背景圖檔拉伸填充避免重複顯示》後用background-repeat配合background-size解決了底圖不重複的問題。但另一個問題來了，圖檔是按寬度作為比例進行縮放的，如果這張圖是橫向，在手機豎向時，下面一截就空了，如下圖：
再次看《用CSS把背景圖檔拉伸》時發現示例中有 background-attachment: fixed; 屬性加上一試，Ok了。 如下圖
今天要解決一個用背景圖以拉伸方式（不重複）填充背景的問題。
看了《用CSS把背景圖檔拉伸》和《css 如何讓背景圖檔拉伸填充避免重複顯示》後用background-repeat配合background-size解決了底圖不重複的問題。但另一個問題來了，圖檔是按寬度作為比例進行縮放的，如果這張圖是橫向，在手機豎向時，下面一截就空了，如下圖：
再次看《用CSS把背景圖檔拉伸》時發現示例中有 background-attachment: fixed; 屬性加上一試，Ok了。 如下圖