無法使用Sass獲取正確的圖像路徑

我正在學習Sass。我在YouTube上關注此tutorial。一切都看起來發現，但當涉及到調用圖像我無法訪問我的圖像內的圖像文件夾。無法使用Sass獲取正確的圖像路徑

這裏是我的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; 
}

確切的寬度和高度是正確的。但不能訪問圖像。 :(

來源

2016-11-24 Jerielle

你能顯示你的文件目錄結構？ –

好的等待我將更新我的代碼 – Jerielle

@BlackEnigma，我已經更新。 – Jerielle

請儘量給他的高度和寬度，因爲烏爾道路的權利，從而儘量給予高度和寬度

來源

2016-11-24 07:07:20

謝謝，但我已經設置了高度和寬度。檢查我最後的代碼。我將寬度設置爲'width：image-width（'../ images/small3.png'）'在我所聽到的教程中，它將獲得圖像的確切寬度。我是否需要像硬編碼一樣手動設置高度和寬度？ – Jerielle

add http_path =「../」 –

同樣的效果，沒有圖像 – Jerielle

問題是與你的config.rb文件

您需要將此行添加到它

relative_assets = true

這將使指南針助手啓用對圖像相對路徑和其他資產

來源

2016-11-24 07:26:12

好吧現在試試吧 – Jerielle

還是沒有圖像。我也修改了這一行'http_path =「../」'但仍然沒有圖像 – Jerielle

把http_path改爲'http_path ='/'' –

無法使用Sass獲取正確的圖像路徑

回答

相關問題