CSS背景图片如何平铺?
若想让背景图片完全覆盖整个容器,需要使用CSS的背景图平铺属性。以下是提供了两种平铺图片的方法:
1. repeat属性
使用repeat属性可以让图片水平和垂直方向平铺。我们可以在CSS文件中使用以下代码:
```
.container {
background-image: url("img/background.png");
background-repeat: repeat;
}
```
这会使容器内的每个背景行和列都显示相同的图像平铺。
2. no-repeat属性
使用no-repeat属性可以防止图片在水平和垂直方向上重复出现。同样,我们可以在CSS文件中使用以下代码:
```
.container {
background-image: url("img/background.png");
background-repeat: no-repeat;
}
```
这会使图像在容器内不重复出现,只显示一次。
总结
以上是两种超级简单的平铺图像的方法。请记住,在使用CSS样式时,尽量避免要素过多,以确保页面的速度和性能。