這篇文章將為大家詳細講解有關CSS中怎么實現背景圖片平鋪，文章內容質量較高，因此小編分享給大家做個參考，希望大家閱讀完這篇文章后對相關知識有一定的了解。
CSS背景圖片平鋪技巧
使用CSS來設置背景圖片同傳統的做法一樣簡單，但相對于傳統控制方式，CSS提供了更多的可控選項，我們先來看看最基本的設置圖片的方法。xhtml代碼：
代碼如下:
<dividdivid="content"> </div>
CSS代碼：
代碼如下:
#content{ border:1pxsolid#000fff; height:500px; background-image:url(images/bg.GIF); }◆網頁中id為content的元素被我們設置了使用images文件夾下的bg.GIF作為背景，與傳統表格式布局中的設置并無差別，在默認狀態下，背景同樣以平鋪的方式出現在元素之中。然而使用CSS來控制背景當然不可能如此簡單，實際上CSS為我們提供了更多用于控制背景的屬性，包含可以控制元素是否需要平鋪。改進后的代碼：
代碼如下:
#content{ border:1pxsolid#000fff; height:500px; background-image:url(images/bg.GIF); background-repeat:repeat-x; }◆加了background-repeat:repeat-x;之后,背景現在只在X軸即橫向進行了平鋪操作，縱向并沒有進行平鋪。這便是CSS對于背景細節的控制之一。background-repeat是針對背景平鋪的屬性設置，可選的值包含：
代碼如下:
repeat即默認方式，完全平鋪背景； no-repeat在X及Y軸方向均不平鋪； repeat-x橫向平鋪背景； repeat-y縱向平鋪背景。
關于CSS中怎么實現背景圖片平鋪就分享到這里了，希望以上內容可以對大家有一定的幫助，可以學到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
