0

我试图让我的背景图像显示在标题 div 中，但它没有显示。有人可以告诉我在哪里做错了吗？

CSS代码：

#header{
width:900px;
/*background-color:#009999;*/
background-image:url('../images/background_img.jpg');
float:left;
text-align:center;
}

html代码

<body>
<div class="contentwrapper">
<div id="header">
hello

<!--<div id="logo">
    <img src="images/small_gama_logo.png" />
</div>
<div id="company_name">
    <h1>Gama Corporate Services Sdn Bhd</h1>
</div>-->
</div>
<div id="navbar">
    <ul>
        <li>Home</li>
        <li>About</li>
        <li>Contact</li>
    </ul>
</div>
4

5 回答 5

1

尝试为您的 DIV 设置一个高度。它不会根据您的背景图像自动调整大小。

于 2012-08-28T07:20:19.360 回答
1

将高度添加到您的 div。

如果删除它，它实际上仍会显示，因此您必须真正检查 img 的路径以及名称。确保一切正确，并且 img 存在于您想要的目录中。

#header{
width:900px;
/*background-color:#009999;*/
background-image:url('http://placehold.it/200x200');
float:left;
text-align:center;
height: 200px;
}​

我复制/粘贴了您的代码并仅添加了高度，更改了 img 位置，因此您的代码很好。应该是img的问题。

http://jsfiddle.net/Kyle_Sevenoaks/qtenp/

于 2012-08-28T07:49:14.050 回答
0

也为#header 设置高度属性

#header{
 width:900px;
 height: 400px;
 /*background-color:#009999;*/
 background-image:url('../images/background_img.jpg');
 float:left;
 text-align:center;
}
于 2012-08-28T07:20:29.127 回答
0

嗨，现在使用高度

#header{
height:100px;
}
于 2012-08-28T07:27:03.820 回答
0

很可能背景图像的 URL 不正确（请注意，它是相对于 CSS 文件的 URL）。也background-image可以被更具体的 CSS 规则覆盖。

此外，在http://jsfiddle.net上查看实时示例会非常有帮助

于 2012-08-28T07:44:54.197 回答