为什么这不是打开图像？

Question

我的问题是图片不会在页面上加载。它在文件夹中，它是一个.png，看起来一切都是正确的......关于如何加载img的任何想法？

header.masthead {
    text-align: center;
    color: white;
    background-image: url(..//HGlogo.png);
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover; 
}

Answer 1

您必须将单个/用于创建文件位置，例如

background-image: url('../img/HGlogo.png');

假设您在同一文件夹或同一位置有图像，请不要这样使用（../)

Answer 2

很难说没有看到你的文件夹结构，它可能是这样的：

background-image: url('../images/HGlogo.png');或 background-image: url('../HGlogo.png');

添加一个至少显示结构的截图

<强> 实施例

请记住：（取自Quick Reminder About File Paths）

  

  
• 图像与引用它的文件位于同一目录中吗？
  
• 目录位于
目录下   
• 目录上方？
  

     

在＆＃34;下面＆＃34;和＆＃34;以上＆＃34;，我的意思是子目录和父目录。   相对文件路径为我们提供了双向旅行的方式。拿一个   看看我的原始例子：

     

以下是您需要了解的相关文件路径：

     

  
• 以＆＃34; /＆＃34开头;返回根目录并从那里开始
  
• 以＆＃34; ../"开头;向后移动一个目录并从那里开始
  
• 以＆＃34; ../../&# 34开头;向后移动两个目录并从那里开始（依此类推......）
  
• 要继续前进，只需从第一个子目录开始并继续前进
  

Answer 3

路径到图片必须相对于您的css文件

假设你的目录结构是这样的=＆gt;

project
  --css
    --cssfile
  --img
    --HGlogo.png

那么你的代码必须是

background-image: url(../img/HGlogo.png)

Answer 4

三次检查图像的URL是否正确。还

header.masthead

似乎没有指定任何尺寸，这会使其不显示。同时清除浏览器缓存，Chrome调试器是你最好的朋友。否则一切似乎都是正确的。