CSS:在CSS中设置背景图像

时间:2009-03-16 07:44:52

标签: css

在CSS中设置背景图像时,正确的语法是什么?在视觉工作室中,因为它出现在背景中似乎没有问题。但在IE或FF等浏览器中,背景不会出现。我在这里错过了什么?

我正在使用的语法如下(我认为是正确的......)

#headerArea
{
    height: 150px;
    background-image: url('/images/bgimage.jpg');
}

以上是正确的吗?

8 个答案:

答案 0 :(得分:7)

根据您的文件夹结构以及CSS相对于其使用的图像的位置,您必须上到图像目录的根级别并从那里访问它,因此您可以尝试类似

background-image: url('/../images/bgimage.jpg');

答案 1 :(得分:6)

如果您在不使用网络服务器的情况下在本地计算机上进行测试(例如,如果您在FF中的网页的网址以“file://”开头,则该网址将无效。您需要指定亲属图像的路径,因为否则它将在您的硬盘根目录中查找该图像。

所以,如果您的文件是这样的:

/some/path/html/index.html
/some/path/html/images/bgimage.jpg

您的代码如下:

background-image: url('images/bgimage.jpg');

答案 2 :(得分:6)

我得到了我的工作w / ../ images / bgimage.jpg

如何?我没有使用引号 - 例如:

background-image: url(../images/bgimage.jpg);

答案 3 :(得分:4)

这是正确的语法。您是否检查过图像是否在正确的位置?

答案 4 :(得分:3)

请记住,相对路径是相对于CSS表格的。

答案 5 :(得分:2)

如果是相对路径,请删除网址路径中的标题“/”?

答案 6 :(得分:1)

你确定网址的开头是/?你是不是想在“images”子目录中找到图像...这意味着url('images / bgimage.jpg')?

答案 7 :(得分:1)

我的CSS文件位于“Themes”文件夹中。 图像保存在“图像”文件夹中。 “Themes”和“Images”都是我项目根目录下的子文件夹。

在这种情况下,您应该使用

background-image: url(../Images/imageName.jpg);