1

所以我有两个css。

  1. 样式.css
  2. 注册.css

我创建了一个名为 css 的文件夹并将 signup.css 放在 css 文件夹中。

signup.css 是 style.css 的副本，只是放在 CSS 文件夹中。

这是包含图像的css代码：

#body{
width:683px; margin:0 auto; padding:0 0 60px 0;
background:url(images/header_bg.gif) no-repeat right top #F7F7F7; color:#171717;}

当我重新加载网页时，图像坏了，所以我将代码更改为：

#body{
width:683px; margin:0 auto; padding:0 0 60px 0;
background:url(../images/header_bg.gif) no-repeat right top #F7F7F7; color:#171717;}

但是图像仍然无法加载。如何调整 css 以使图像加载与放置在 css 文件夹下的 style.css 一起？

回答一个问题： 

头
    meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    标题>
    链接 href="css/signup.css" rel="stylesheet" type="text/css" />
    /头>

4

3 回答 3

5

在您的 HTML 中设置basehref标签head：

<base href="http://example.org/image_base_path/" />

所有没有协议的请求都会在前面加上这个 URL。

background:url(images/header_bg.gif)将被加载为http://example.org/image_base_path/images/header_bg.gif

于 2012-07-05T13:42:41.050 回答
0

尝试使用

background:url(/images/header_bg.gif)

假设相对于您的域的图像文件夹的路径是 /images

于 2012-07-05T13:36:51.180 回答
0

我不确定我是否完全遵循您的更改，但是我假设您从以下内容开始：

（HTML）：

<head>
...
<link rel="stylesheet" type="text/css" href="style.css" media="screen" />
...
</head>

带有文件和目录：

index.html
style.css
images/
images/header_bg.gif

它工作正常。然后，如果您添加了以下目录和文件：

css/
css/signup.css

并将 HTML 更改head为：

<link rel="stylesheet" type="text/css" href="css/signup.css" media="screen" />

而css/signup.css你改变了

background: url(images/header_bg.gif) no-repeat right top #F7F7F7; color:#171717;}

到：

background: url(../images/header_bg.gif) no-repeat right top #F7F7F7; color:#171717;}

并且所有文件都是世界可读的（或网络服务器用户可读的），那么你的东西应该可以正常工作。确保您的 css 目录是全球可执行的，并且 css 文件是全球可读的。您可以通过直接在浏览器中打开来验证您的 css 文件是否可读，即：

http://www.mysite.com/css/signup.css

如果您收到 404 错误，则 Web 服务器无法读取 css 文件。

如果您愿意，也可以在 css 文件中使用绝对路径来指向图像，例如：

background: url(/images/header_bg.gif) no-repeat right top #F7F7F7; color:#171717;}

（假设该images文件夹位于您网站的根文件夹中）。

于 2012-07-05T13:39:43.753 回答