在CSS中,使用重復背景圖是非常常見的。然而,在某些情況下,你可能會發現背景圖片的重復效果中出現了一定的行間距,這個問題該如何解決呢?
background: url(images/bg.jpg) repeat-y;
如上的代碼會將圖片垂直平鋪到整個元素中。然而,你可能會看到在重復的圖片之間存在一些間隙。
這是由于背景圖片的高度不足以鋪滿整個元素從而產生的問題。所以,我們需要調整背景圖片的高度以解決這個問題。針對這一問題,我們可以使用background-size屬性。通過設置background-size:100%屬性值,背景圖像將會被拉伸,完全鋪滿整個元素。
修改后的代碼如下:
background: url(images/bg.jpg) repeat-y; background-size: 100%;
通過設置background-size為100%,你可以將你的背景圖片完全鋪滿整個元素,從而解決背景圖片重復時的行間距問題。
上一篇css陰影效果透明度
下一篇css重置代碼順序