css图片铺满整个背景

作者：狂刀血斧发布日期:2026-03-05 浏览:89

/* 设置背景图片铺满整个页面 */
body {
  /* 使用 background 属性设置背景图片 */
  background: url('your-image-url.jpg') no-repeat center center fixed;

  /* 背景图片大小设置为 cover，确保图片铺满整个背景 */
  background-size: cover;

  /* 设置背景颜色，当图片加载失败时作为备用背景 */
  background-color: #000;

  /* 确保 body 占满整个浏览器窗口 */
  margin: 0;
  height: 100vh;
}

解释说明：

background: 使用 url('your-image-url.jpg') 指定背景图片的路径。no-repeat 表示图片不重复，center center 表示图片居中显示，fixed 表示背景图片固定不动。
background-size: cover: 这个属性确保背景图片按比例缩放并铺满整个容器，可能会裁剪部分内容以确保图片完全覆盖背景。
background-color: 设置一个备用背景颜色，以防图片加载失败。
margin 和 height: 确保 body 占满整个浏览器窗口，不留空白边距。

上一篇：css背景图铺满

下一篇：css文字超长省略号