css中怎么设置图片重复 |sublime 快捷生成css

background-repeat: repeat-x;  /* 水平重复 */
background-repeat: repeat-y;  /* 垂直重复 */
background-repeat: repeat;   /* 水平垂直重复 */
background-repeat: no-repeat; /* 不重复 */

其中repeat-x表示水平方向重复，repeat-y表示垂直方向重复，repeat表示同时重复水平和垂直方向，no-repeat则表示不重复。

例如，下面的代码将背景图片设置为水平方向重复：

background-image: url("example.jpg");
background-repeat: repeat-x;

如果需要让背景图片居中显示，可以使用background-position属性来调整图片位置。例如，下面的代码将图片设置为在水平和垂直方向都居中显示：

background-image: url("example.jpg");
background-repeat: no-repeat;
background-position: center center;

需要注意的是，如果背景图片的边缘部分有边框或圆角等样式，重复的部分也会继承这些样式。可以使用background-clip属性来控制背景图片区域的裁剪方式，以避免不必要的样式重复。

除了使用background-repeat属性，还可以使用background-size属性对图片进行缩放，以适应不同大小的容器。

例如，下面的代码将背景图片无限重复，并缩放为原来的一半大小：

background-image: url("example.jpg");
background-repeat: repeat;
background-size: 50% auto;