以前做網頁佈局的時候，一個div只能設定一張背景圖片，設定多個背景的話，要用多個div嵌套才能實現，這樣相容性比較好。若您的網站要求相容瀏覽器低版本，建議使用此方法。 css3的出現，解決了一個div只能設定一個背景的問題，讓一個div可以設定多個背景圖片。 background-image也可以設定線性漸變，等效果。
關於css3的background，功能很強大，有很多屬性，像是background-size等等，這些屬性都可以寫一篇部落格來講述。關於css3background的其他屬性，後面會出部落格來單獨講述！
CSS3/CSS1 background-image 屬性
語法:
background-image：<bg-image> [ , <bg-image> ] *<bg-image> = none | <url> | <linear-gradient> | <radial-gradient> | <repeating-linear-gradient> | <repeating-radial-gradient>
預設值：none
取值：
#none：無背景圖。
< url >：使用絕對或相對位址指定背景圖片。
< linear-gradient>：使用線性漸層建立背景圖片。 （CSS3）
< radial-gradient>：使用徑向(放射性)漸層建立背景影像。 （CSS3）
< repeating-linear-gradient>：使用重複的線性漸層建立背景影像。 （CSS3）
< repeating-radial-gradient>：使用重複的徑向(放射性)漸變創建背景圖像。 （CSS3）
說明：
設定或檢索物件的背景圖像。
如果設定了background-image，同時也建議作者設定background-color用於當背景圖像不可見時保持與文字一定的對比。
對應的腳本特性為backgroundImage。
CSS中如何設拉伸背景圖片鋪滿屏幕
我寫的CSS代碼是
#bg
{
width: 100%;
height: 100%;
background:url(images/beijing.png);
}這樣子他會重複圖片鋪滿屏幕，我想要讓他拉伸圖片鋪滿螢幕，該怎麼寫呢？
background:url(images/beijing.png) repeat;
加屬屬
background-size:100%;background:url(images/beijing.png) no-repeat;
加屬background-size:100%;background:url(images/beijing.png) no-repeat; 圖片會失真哦！
要嘛是外框限制了，都設為100%，我這裡試驗了下是鋪滿的，你再看看有沒有別的屬性影響了的。
以上是css background-image如何平鋪？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
