时间:2021-07-01 10:21:17 帮助过:83人阅读
推荐参考:《CSS教程》
下面我们就通过简单的代码示例,给大家介绍css实现背景图像重复的效果。
代码示例如下:
<!DOCTYPE> <html> <meta charset="utf-8"> <head> <title></title> <style type="text/css"> body{ background-image: url(img/154e.png); background-repeat: repeat; } </style> </head> <body> </body> </html>
这里我们使用的单张图片如下:
那么背景图片重复的效果最终如下图(部分截图):
相关属性介绍:
background-image 属性可以为元素设置背景图像。元素的背景占据了元素的全部尺寸,包括内边距和边框,但不包括外边距。
background-repeat 属性设置是否及如何重复背景图像。
注:默认情况下,背景图像位于元素的左上角,并在水平和垂直方向上重复。
本篇文章就是关于css实现背景图像重复的效果方法介绍,也是非常简单的,希望对需要的朋友有所帮助!
以上就是CSS如何实现背景图像重复效果的详细内容,更多请关注Gxlcms其它相关文章!