使用background-image添加图片后，设置no-repeat/center时图片消失问题咨询

你这情况百分百是写法错了——background-image属性只能指定图片路径，不能直接加no-repeat、center这类控制重复或位置的属性值，一旦加了，浏览器会把整个值判定为无效的图片URL，自然就加载不出背景图了。

正确写法分两种： #

1. 拆分单独属性写：
   把控制重复和位置的需求放到对应的专属属性里：

.Main {
  height: 800px;
  background-image: url('../img/bg/laptop.png');
  background-repeat: no-repeat; /* 控制不重复 */
  background-position: center; /* 控制居中 */
}

2. 用background简写属性：
   如果想写在一起，要用background这个复合属性，顺序可参考：background: [颜色] [图片路径] [重复方式] [位置]

.Main {
  height: 800px;
  background: url('../img/bg/laptop.png') no-repeat center;
}

你可以检查下自己的错误写法，比如是不是写成了background-image: url('../img/bg/laptop.png') no-repeat;——这种写法完全不符合CSS语法规范，浏览器直接忽略这个属性，所以背景图就消失了。

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