在Css中,我們通常使用背景圖來裝飾網(wǎng)站頁面。但是,有時(shí)候我們會遇到這樣的問題:當(dāng)瀏覽器窗口大小改變時(shí),背景圖的高度不會自動擴(kuò)展。這時(shí)候,我們需要使用一些技巧來實(shí)現(xiàn)背景圖高度拉伸的效果。
/* 實(shí)現(xiàn)背景圖高度拉伸的方法 */ body { background: url('bg.jpg') no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } /* 解釋 */ background-size: cover; 表示背景圖自適應(yīng)窗口大小,并保持比例不變。 background: url('bg.jpg') no-repeat center center fixed; 表示將背景圖置中固定,不隨窗口滾動。
使用以上方法,我們可以輕松實(shí)現(xiàn)背景圖高度拉伸的效果,使得網(wǎng)站頁面看起來更加美觀和舒適。