0

我有一个背景图像正在加载到浏览器中,但它没有在页面上呈现。这是代码:

HTML

<body>
  <div id="mainContainer">
  </div>
</body>

CSS

#mainContainer
{
   background-image:url('bckgrdImg.png');
}

而已。我只需要渲染图像。同样,当我在 Chrome 中检查页面时,我看到图像正在加载到浏览器中,但它不在网页上。有什么想法吗?谢谢。

4

4 回答 4

2

尝试给你的 div 一些宽度和高度。这是因为如果你看它,div 的高度为 0。

于 2012-11-02T03:08:08.017 回答
2

嗨,现在至少定义min-height你的,div 因为你r div id width是默认的100%,而height is 0不是至少定义min-height你的div

像这样

#mainContainer
{
   background-image:url('bckgrdImg.png');
   min-height:200px;  // height define according your design or background images
}
于 2012-11-02T04:18:38.540 回答
2

一个链接会很有帮助。

但请先尝试在#mainContainer 上设置宽度和高度。

喜欢:

#mainContainer
{
    width: 100%;
    height: 100%;
   background-image:url('bckgrdImg.png');
}
于 2012-11-02T03:08:48.947 回答
-1

删除单引号

#mainContainer
{
   background-image:url(bckgrdImg.png);
}

您可能需要为此 div 定义维度。当 div 中没有任何内容,没有宽度和高度 css 时,div 将显示为不可见,因为它是 0px x 0px :)

#mainContainer
{
   background-image:url(bckgrdImg.png);
   height:100%;
   width:100%
}
于 2012-11-02T03:09:38.940 回答