背景图片不显示的原因及解决办法！

在做前端项目的时候，大家经常会遇到背景图片无法显示的问题，今天给大家总结几点原因，及如何解决：

1、图片路径不对

在css文件中写图片路径要用相对路径，不可以使用路径，

错误：background-image:url(http://sxxdispark.oss-cn-hangzhou.aliyuncs.com/upload/20171010/59dc3cd1bf1ee.png);

很容易出错：background-image:url(../20171010/59dc3cd1bf1ee.png);我们经常将“../”与“./”与“/”傻傻分不清

2、同时使用background-image与background属性，导致background-image图片显示不出来

.hero-section {
background-image:url(banner1.png);
background-repeat:no-repeat;
background-attachment:fixed;
background-position:center;
background: #f3f3f3;
background-size: cover;
padding: 150px 0 0 0;
}

这样写导致添加的背景图片会被background背景色覆盖调。

解决办法：去掉background属性，改成background-color属性，这样即能加载出图片，又能在图片加载缓慢的同时有背景色填充！