css - 无法使用 Sass 获取正确的图像路径

Question

我正在学习 Sass。我正在关注这个 tutorial在YouTube上。一切看起来都找到了，但是在调用图像时，我无法访问图像文件夹中的图像。

这是我的 scss 部分:

img[alt="Programming Frameworks"] {
    content: image-url('small2.png');
}

还有我的配置:

http_path = "/"
css_dir = "stylesheets"
sass_dir = "sass"
images_dir = "images"
javascripts_dir = "javascripts"

当我从开发者控制台检查 css 时，我得到了这个:

img[alt="Programming Frameworks"] {
    content: url('/images/small2.png?1479092109');
}

当我手动修改开发控制台中的 css 输出时:

 img[alt="Programming Frameworks"] {
        content: url('../images/small2.png?1479092109');
 }

它可以访问图像，但在我的 HTML 中。它不显示。

你能帮帮我吗？我是 sass 开发的新手。

这是我的目录结构:

我也试试下面的代码:

img[alt="Programming Frameworks"] {
    content: image-url('small3.png');
    width: image-width('../images/small3.png');
    height: image-height('../images/small3.png');
}

然后我检查了我的开发者控制台，我得到了这个:

img[alt="Programming Frameworks"] {
    content: url('/images/small3.png?1479092299');
    width: 466px;
    height: 308px;
}

确切的宽度和高度是正确的。但是无法访问图像。 :(

Answer 1

问题出在您的config.rb 文件

你需要添加这一行

relative_assets = true

这将允许 compass 助手启用图像和其他 Assets 的相对路径