如何巧妙使用CSS实现背景图片的完美平铺？

在CSS中，使用background-repeat: repeat;可以让背景图片平铺。

CSS 背景图片平铺技巧

1. 背景图片平铺的基本语法

在 CSS 中，可以使用 `background-repeat` 属性来控制背景图片的平铺方式，`background-repeat` 属性有以下几个取值：

`repeat`：默认值，背景图片在水平和垂直方向上重复平铺。

`repeat-x`：背景图片在水平方向上重复平铺，垂直方向上不重复。

`repeat-y`：背景图片在垂直方向上重复平铺，水平方向上不重复。

`no-repeat`：背景图片不平铺，只显示一次。

2. 示例代码

以下是一个简单的示例，展示了如何使用 `background-repeat` 属性来控制背景图片的平铺方式：

```html

repeatrepeat-xrepeat-yno-repeat

```

3. 相关问题与解答

问题1：如何让背景图片在容器内居中显示？

答：要使背景图片在容器内居中显示，可以使用 `background-position` 属性设置为 `center`：

```css

.container {

background-position: center;

```

问题2：如何设置背景图片的大小？

答：要设置背景图片的大小，可以使用 `background-size` 属性，要将背景图片设置为容器的大小，可以这样写：

```css

.container {

background-size: cover;

```

`cover` 表示背景图片将覆盖整个容器，可能会被裁剪以保持比例，其他可选值包括 `contain`（背景图片将被缩放以完全适应容器，可能会留有空白）和具体的尺寸值（如 `100px 100px`）。