1
我已經編寫了一個SCSS地圖變量和一個@each循環來爲文件下載鏈接分配不同的圖標，如下所示。SCSS Map無法在Compass中編譯
$file-icons: (
"application/vnd.ms-excel": "../images/ico-excel.png",
"application/pdf": "../images/ico-pdf.png",
"image/tiff": "../images/ico-img.png",
"image/gif": "../images/ico-img.png",
"image/png": "../images/ico-img.png",
"image/jpeg": "../images/ico-img.png",
"application/x-shockwave-flash": "../images/ico-flash.png",
"audio/mpeg": "../images/ico-audio.png"
);
@each $file in $file-icons {
img[title="#{nth($file, 1)}"] + a:hover {
background: url("#{nth($file, 2)}") right top no-repeat;
}
}
當我測試這對Sassmeister，它編譯完全按照我期望：
img[title="application/vnd.ms-excel"] + a:hover {
background: url("../images/ico-excel.png") right top no-repeat;
}
img[title="application/pdf"] + a:hover {
background: url("../images/ico-pdf.png") right top no-repeat;
}
img[title="image/tiff"] + a:hover {
background: url("../images/ico-img.png") right top no-repeat;
}
img[title="image/gif"] + a:hover {
background: url("../images/ico-img.png") right top no-repeat;
}
img[title="image/png"] + a:hover {
background: url("../images/ico-img.png") right top no-repeat;
}
img[title="image/jpeg"] + a:hover {
background: url("../images/ico-img.png") right top no-repeat;
}
img[title="application/x-shockwave-flash"] + a:hover {
background: url("../images/ico-flash.png") right top no-repeat;
}
img[title="audio/mpeg"] + a:hover {
background: url("../images/ico-audio.png") right top no-repeat;
}
我使用羅盤這個項目。當我使用compass compile時，出現以下錯誤。
[email protected]:~/project$ compass compile
error sass/style.scss (Line 2 of sass/_partial.scss: Invalid CSS after "...n/vnd.ms-excel"": expected ")", was ": "../images/ic...")
create stylesheets/style.css
我不確定是什麼原因導致了這個錯誤。它可能與Sass的新地圖有關，也許Compass還沒有完全支持它？
感謝您確認我的懷疑並提供解決方法！ – TaxFoundation
奇怪的東西。它在另一臺機器上爲我工作，但不在這臺機器上。我很確定，我總是以同樣的方式安裝Compass。感謝您指點我正確的方向！ –
更新。它看起來像* Bundler *正在安裝比'gem install'更新的* Compass *版本。 –