Question

我已经尝试了所有方法，无法弄清楚为什么我无法让该div显示背景图像。

**Here is the code:**

body {
  margin: 0px;
  padding: 0px;
}

#top {
  background-image: url(../IMG/PINS.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

<html>

<head>
  <title>TEST BCKGRND IMAGE</title>
  <link rel="stylesheet" type="text/css" href="CSS/style.css">
</head>

<body>
  <div id="top">


  </div>
</body>

</html>

文件结构设置如下：我有一个名为TEST_SITE的主文件夹，在该文件夹中，有一个CSS文件夹和一个IMG图像文件夹。

我一生都无法弄清楚为什么背景图片没有显示出来。

如果有人可以请我提一下可能出什么问题，我将不胜感激。

谢谢。

Answer 1

您需要从0x8000358 <payload>: 0xaf00b480 0x22684b02 0xf7ff809a 0xe7f9fff1 0x8000368 <payload+16>: 0x40004800 0xb082b580 0xf001af00 0x2102f863 0x20004000 <_heap+3144>: 0xaf00b480 0x22684b02 0xf7ff809a 0xe7f9fff1 0x20004010 <_heap+3160>: 0x40004800 0x00000000 0x00000000 0x00000000设置高度和宽度值，并像我的回答一样使用#top

background-position:center center; background-repeat:no-repeat;

或者您可以这样：

#top{
   width:500px;
   height:500px;
   background-image: url(YOUR IMAGE PATH); 
   background-repeat:no-repeat;
   background-position:center center;
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;
}

Answer 2

设置#top div的高度很重要：如果先设置宽度，然后将高度设置为auto，则背景仍然不会显示，因为div中没有内容可设置背景。但是，如果通过在CSS中设置一个高度来强制设置高度，则背景将显示。您为路径提供的代码是错误的，因为background-image仅期望指向图像的路径（而没有其他内容），而您给出的内容却适合background。

看到我的fiddle

Answer 3

这是因为您的div为空。如果向其中添加内容，则会看到背景。您还可以设置高度或使用CSS添加填充。

<div id="top">
 <p>A large amount of text here</p>
</div>

或

#top{
 height:400px;
 background-image: url(yourimagehere); 
 background-repeat:no-repeat;
 background-position:center center;
 -webkit-background-size: cover;
 -moz-background-size: cover;
 -o-background-size: cover;
 background-size: cover;
}

或

#top{
 padding: 25px 0;
 background-image: url(yourimagehere); 
 background-repeat:no-repeat;
 background-position:center center;
 -webkit-background-size: cover;
 -moz-background-size: cover;
 -o-background-size: cover;
 background-size: cover;
}

div中没有显示背景图片

3 个答案:

div中没有​​显示背景图片

3 个答案:

div中没有显示背景图片