css背景平铺怎么解决

在使用CSS设计网页时，经常会用到背景图片。由于不同的网页尺寸和设备分辨率不同，我们需要将背景图片进行平铺，以适应不同的屏幕大小。但是，有时背景图片却不会按照设想的那样平铺，这时我们该怎么解决呢？

解决方法就是通过CSS属性 background-repeat 来设置背景图片的平铺方式。该属性有5种取值：

background-repeat: repeat-x;
 /* 水平方向重复 */
background-repeat: repeat-y;
 /* 垂直方向重复 */
background-repeat: repeat;
 /* 水平垂直方向都重复 */
background-repeat: no-repeat;
 /* 不重复 */
background-repeat: space;
 /* 平铺并间隔 */
 

1、水平方向重复

使用 repeat-x 值，背景图片将会在水平方向上重复平铺。

background-repeat: repeat-x;
 

2、垂直方向重复

使用 repeat-y 值，背景图片将会在垂直方向上重复平铺。

background-repeat: repeat-y;
 

3、水平垂直方向都重复

使用 repeat 值，默认值，背景图片将会在水平垂直方向上重复平铺。

background-repeat: repeat;
 

4、不重复

使用 no-repeat 值，背景图片不会重复平铺。

background-repeat: no-repeat;
 

5、平铺并间隔

使用 space 值，背景图片在水平垂直方向上平铺同时在图片之间加上间隔。

background-repeat: space;
 

我们可以将这些属性通过CSS样式表的方式应用到页面元素中。