body标签背景图片不显示问题求助（附HTML/CSS代码）

嘿，我来帮你找找问题出在哪！看你的CSS代码，body的background-image写法犯了个新手常踩的小坑：

background-image这个属性只能用来指定图片的URL地址，而no-repeat是另一个独立的CSS属性background-repeat的值，你把它们写在同一个声明里，浏览器根本识别不了，这就是背景图片显示不出来的核心原因。

给你两种修正方法，选哪种都可以：

方法1：拆分单独的背景属性 #

把背景相关的属性分开写，清晰明了，不容易出错：

body {
  background-image: url("https://i.giphy.com/media/H75Lo6V4M5pWrDo8mZ/giphy.webp");
  background-repeat: no-repeat; /* 单独设置图片不重复 */
  background-color: Linen;
  padding: 0;
  margin: 0;
}

方法2：使用background复合属性（推荐） #

CSS提供了background这个复合属性，可以把背景颜色、图片、重复方式等多个属性整合到一行里，写法更简洁：

body {
  background: Linen url("https://i.giphy.com/media/H75Lo6V4M5pWrDo8mZ/giphy.webp") no-repeat;
  padding: 0;
  margin: 0;
}

额外小优化（可选） #

如果希望背景图片能铺满整个页面，不会出现空白区域，还可以加上这几个属性优化显示效果：

body {
  background: Linen url("https://i.giphy.com/media/H75Lo6V4M5pWrDo8mZ/giphy.webp") no-repeat center center;
  background-size: cover; /* 让图片自适应覆盖整个容器 */
  min-height: 100vh; /* 确保body高度至少占满浏览器视口 */
  padding: 0;
  margin: 0;
}

这样修改后，你的背景图片应该就能正常显示啦！

内容的提问来源于stack exchange，提问作者Roohullah Kazmi