CSS层叠样式表背景图片重复属性

在html中如何设置背景图片重复?
我想让背景图片仅仅在垂直方向重复?
我想让背景图片在水平方向重复?

解释


这个标记是用来设置背景图片的重复方向。
这取决于背景图片在水平方向或者垂直方向或者以上两种方向上重复。
可以设置以下的数值。
a)repeat:这个值说明背景图片在两个方向上重复
b)repeat-x:这个值说明背景图片仅仅在垂直方向上重复
c)repeat-y:这个值说明背景图片仅仅在水平方向上重复
d)no-repeat:这个值说明背景图片没有重复

示例1:
<div style="background-image: url('test3.jpg'); background-repeat: repeat; background-color: green;"> 颜色名称 <br><br><br></div>
结果:
颜色名称


示例2:
<div style="background-image: url('test3.jpg'); background-repeat: repeat-x; background-color: green;"> 颜色名称 <br><br><br></div>
结果:
颜色名称


示例3:
<div style="background-image: url('test3.jpg'); background-repeat: repeat-y; background-color: green;"> 颜色名称 <br><br><br></div>
结果:
颜色名称


示例4:
<div style="background-image: url('test3.jpg'); background-repeat: no-repeat; background-color: green;"> 颜色名称 <br><br><br></div>
结果:
颜色名称


现在通过使用djv标记你就可以把图片 设置在背景中了。
在页面中图片重复的方向就取决于repeat标记了。