css图片的重复属性有哪些(css图片的重复属性)

在CSS中，我们可以使用background-repeat属性来控制图片的重复方式，这个属性有几个常见的取值，下面我们逐个来看。

background-repeat: repeat;

这个是默认值，表示在水平和垂直方向都以图片的原始大小不断重复展示。如果图片比背景区域小，那么该区域会被填充满，如果图片比该区域大，图片会被剪裁。

background-repeat: repeat-x;

表示只在水平方向重复，即图片在垂直方向上被拉伸至与背景区域相等，然后不断重复展示。

background-repeat: repeat-y;

表示只在垂直方向重复，即图片在水平方向上被拉伸至与背景区域相等，然后不断重复展示。

background-repeat: no-repeat;

表示不重复，即只展示一次图片，如果图片比背景区域大，图片会被剪裁。

除了以上四个常用取值，background-repeat属性还可以接受另外两个值：

background-repeat: space;

表示平铺图片使其充满整个背景区域，如果图片比背景区域小，图片将被缩放。平铺的空间将被平分，空隙大小等于图片之间的间距。

background-repeat: round;

表示平铺图片使其充满整个背景区域，如果图片比背景区域小，图片将被缩放。平铺的空间将被平分，并自动计算合适的空隙大小，同时图片之间的间距相等。