CSS中的repeat-x屬于背景圖片(background-image)的一種屬性,表示在橫向方向上重復(fù)顯示背景圖片。該屬性值為“repeat-x”。
background-image: url(圖片地址); background-repeat: repeat-x;
實(shí)際上,在CSS中還有其它幾種背景圖片的重復(fù)屬性:
- repeat:在橫向縱向方向上均重復(fù)顯示背景圖片。
- repeat-y:在縱向方向上重復(fù)顯示背景圖片。
- no-repeat:不重復(fù)顯示背景圖片。
當(dāng)為repeat-x時(shí),背景圖片會(huì)在橫向方向上不間斷地重復(fù)顯示,直到填滿(mǎn)整個(gè)容器。這在制作水平方向漸變、紋理背景等效果上十分常見(jiàn)。
例如,在body元素上應(yīng)用重復(fù)背景圖片,可以這樣寫(xiě):
body { background-image: url(bg.jpg); background-repeat: repeat-x; }
需要注意的是,在使用重復(fù)背景圖片時(shí),要確保圖片本身寬度足夠長(zhǎng),否則會(huì)出現(xiàn)平鋪不完整的問(wèn)題,影響顯示效果。