CSS中有一個垂直平鋪的屬性,是background-repeat: repeat-y;
這個屬性可以讓背景圖片在垂直方向上無縫平鋪。使用方法很簡單,只需要把需要平鋪的元素的背景圖片設置好,然后在CSS中加上background-repeat: repeat-y;
即可。
.container { background-image: url("bg.jpg"); background-repeat: repeat-y; }
特別要注意的是,如果背景圖片不是很高或者太短,就可能出現拉伸的情況。為了避免這種情況,可以在Photoshop等軟件中將原圖進行復制,使其高度比原圖要高很多。這樣就能夠保證在垂直平鋪時不會出現拉伸的情況。
上一篇css塊y軸居中