如何使用CSS为Sproutcore应用程序引用图像？

Question

所有

简单的问题：我想在我的应用程序中添加一个图像“logo.png”作为背景。我应该把文件放在哪里，我应该如何在与main_page.js一起在资源文件夹中的CSS文件中引用它？

以下是故事的其余部分：

我有一个名为doc-background的CSS类。我知道这个类有效，因为当我在CSS文件中设置背景的颜色时，如下所示： .doc-background { background-color: red}它具有预期的效果，Firebug告诉我正在使用类doc-background。

但是，当我添加一行时 .doc-background { background-image: url('logo.png'); }，没有效果。 Firebug显示类doc-background未应用。当我在Firebug中修改样式以添加关于background-image的行时，它会在工具提示中显示“无法加载URL”。

如果我想使用CSS，有人可以指点我如何使用资源和图片以及放置它们的位置吗？我已成功使用它们使用图像视图并将它们编码为HTML。

这是我已经尝试过的：

• 使用static-url
• 将图像文件移至资源
下的图像文件夹
• 使用路径上的所有变体引用图像 - 包括仅包含图像的资源/图像，不包括...
• 很多谷歌搜索答案，阅读创建自己的应用程序教程等。

如果您有一个示例应用程序，它使用CSS中的颜色和图像，这将是最终的！但是background-image CSS属性的位置和一些帮助会让我开始！

非常感谢，

显示

Answer 1

将图像放在相对于css的某处：

resources / style.css
  资源/图像/ logo.png

然后使用static_url来引用图像：

background-image: static_url('images/logo.png');