twitter-bootstrap - Bootstrap - 背景图像不起作用

Question

我的 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 -->

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

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

Answer 1

没有人知道你在做什么，因为你没有显示它(例如，使用 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);