css图片铺满整个背景
时间: 2023-07-25 07:48:15 浏览: 102
html背景图片铺满网页,CSS3+HTML5 SVG斑点动画背景图片特效
要让一张图片铺满整个背景,可以使用以下 CSS 样式:
```css
body {
background-image: url("path/to/image.jpg");
background-size: cover;
background-repeat: no-repeat;
}
```
其中,`background-image` 属性用于指定背景图片的 URL,`background-size` 属性用于指定背景图片的尺寸,`cover` 值表示让图片尽可能地铺满整个背景区域,可能会裁剪部分图片内容。`background-repeat` 属性用于指定背景图片是否重复,`no-repeat` 值表示不重复。
如果想让背景图片在浏览器窗口大小发生变化时自适应,可以将上述样式应用到 `html` 和 `body` 元素上:
```css
html, body {
height: 100%;
}
body {
background-image: url("path/to/image.jpg");
background-size: cover;
background-repeat: no-repeat;
}
```
这样,背景图片就会自适应浏览器窗口大小,并铺满整个背景。
阅读全文