使用CSS設置背景重復是很常見的技巧,在實際應用場景中,我們可能會發現一些奇怪的現象,例如背景被重復出現的時候會有白線出現。
.background { background-image: url("example.png"); background-repeat: repeat; }
以上代碼中的.repeat屬性表示背景會被重復平鋪,如果圖片邊緣不夠完美,就會產生“縫隙”,從而形成白線。
解決這個問題的方法很簡單,只需要在容器中設置一個背景色,或者在CSS屬性中添加background-position就可以了。
.background { background-color: #fff; background-image: url("example.png"); background-repeat: repeat; background-position: top left; }
以上代碼中的.background-color屬性可以將背景色設置為白色,這樣就會讓白線不再明顯。如果想要更加完美,可以使用background-position屬性調整圖片位置,從而消除白線。
上一篇json批量接口測試工具
下一篇vue自定義公式字段