5

我的 CSS 标记：

.rowbgi {
    background-image:url('img/gradient.png');
    background-color:#cccccc;
}

我的 HTML 标记：

    <div class="span4 rowbgi">
      <img class="img-circle" data-src="holder.js/140x140">
      <h2>Heading</h2>
      <p>Stack Overflow</p>
      <p><a class="btn" href="#">View details </a></p>
    </div><!-- /.span4 -->

我无法看到背景图像，但在背景中可以看到颜色。该图像在路径中可用。

有人可以告诉我我正在做的一些愚蠢的错误吗？

4

4 回答 4

11

没有人知道你在做什么，因为你没有展示它（例如使用 jsfiddle ;P），但我的第一个猜测是你有以下文件结构：

  • 根目录中的 HTML 文件: /index.html,
  • css 目录中的 CSS 文件: /css/style.css,
  • 中的图像/img/gradient.png。

现在，请注意从 HTML/CSS 链接的所有文件都有相对于它们的路径。因此，如果您将 CSS 保留在 中/css，那么 CSS 中的路径img/xxx将链接到/css/img/xxx. 如果我猜对了，这是您的情况，请将样式更改为：

background-image:url(/img/gradient.png);

或者

background-image:url(../img/gradient.png);
于 2013-01-15T16:07:32.150 回答
0

要使用 CSS 加载图像，您必须将图像文件保存在 CSS 文件夹中（如果使用外部样式表）。例如，如果您使用 url image.jpg，CSS 会在 CSS 文件夹中查找该文件。您的 CSS 标记告诉 CSS 在您的 CSS 文件夹内有一个名为的子文件img夹，但情况可能并非如此。

于 2020-05-12T04:00:30.387 回答
0

将您的 png 文件转换为 jpg 并在 html 代码中打开 body 标记后粘贴同一行

于 2021-09-14T11:57:44.137 回答
0

我也尝试使用图像路径格式，但图像根本没有出现。

但是当我将图像上传到我的服务器时，我假设这将适用于任何图像托管平台，如 Imgur，并使用完整路径，它可以工作。

所以，而不是使用：

background-image: url('img/gradient.png');

做：

background-image: url('https://example.com/img/gradient.png');

希望这可以帮助某人！

于 2018-08-04T21:05:13.087 回答