CSS背景图片不起作用

Question

.menubar li {
    float: left;
    width: 115px;
    text-align: center;
    background-image: url(js/left_main_bg_image.gif);
}

背景图片不适用于ie，firefox，chrome。 我也在桌上试试。也不工作。

任何人都可以帮助我！ 我会感谢谁帮助了我。

Answer 1

也将图像的高度添加到CSS声明中。而且您不需要那些<br>标签

下面的内容应该有效：

.menubar li {
    float: left;
    width: 115px;
    text-align: center;
    background: url('js/left_main_bg_image.gif');
     height: 100px;
}

Answer 2

您错过了height CSS属性。请参阅working example。

以下是必需的HTML＆amp; CSS。与您的代码比较，看看您错过了什么。

<强> HTML

<ul class="menubar">
    <li></li>
    <li></li>
</ul>

<强> CSS

.menubar li {
    float: left;
    width: 115px;
    height: 115px; 
    text-align: center;
    background-image: url(js/left_main_bg_image.gif);
}​

Answer 3

.menubar li {
    float: left;
    width: 115px;
    height:100px;
    text-align: center;
    background-image: url('js/left_main_bg_image.gif');
}

注意图片网址周围的引号...

我不知道为什么你的css中有<br>个元素......

Answer 4

预计 li 元素位于 ol 或 ul 标记内，其类别为菜单栏。 确保具有指定类的这些标记存在。