css – 在Firefox中不显示背景图像

div.something {
background:transparent url(../images/table_column.jpg) repeat scroll 0 0;
}

对不起,这是巨大的,但它涵盖了我一贯发生的两种可能性.

可能性1

您可能会发现CSS文件的路径不正确.例如：

说我有以下文件结构：

public/
    css/
        global.css
    images/
        background.jpg
    something/
        index.html
    index.html

在public / index.html上,以下路径将包含CSS文件：

#1:  <link href="./css/global.css"
#2:  <link href="/css/global.css"
#3:  <link href="css/global.css"

但是在public / something / index.html数字1和3将失败.如果您使用这样的目录结构(或MVC结构,例如：http：// localhost / controller / action / params),请使用第二个href类型.

Firebug的网络监视器选项卡将告诉您是否不能包含CSS文件.

关于路径的问题,请记住,图像是相对于CSS文件的路径.所以：

url('./images/background.jpg') /* won't work */
url('../images/background.jpg') /* works: ../ == up one level */

将鼠标悬停在Firebug的CSS选项卡中的背景属性的url()部分,以检查是否正在加载该文件.

可能性2

这可能是div没有内容,因此具有0高度.确保div至少有一行内容(例如：lorem ipsum delors secorum)或：

div.something {
    display: block; /* for verification */
    min-height: 50px;
    min-width: 50px;
}

检查Firebug的布局选项卡(HTML选项卡),以检查div具有高度/宽度.