從SCSS進行Box-Shadow編譯但未在Firebug中顯示;使用指南針

我使用WordPress的Bones HTML5 Boilerplate入門模板（也鏈接到Bootstrap CDN）。我已經導入指南針在我的主要.scss文件：從SCSS進行Box-Shadow編譯但未在Firebug中顯示;使用指南針

@import "compass";

，當我用下面的標記在部分：

.wp-image-6 { 
    @include box-shadow(5px,5px,3px, #888); 
    border-radius: 2em; 
}

代碼似乎在我的style.css編譯罰款文件：

.wp-image-6 { 
    -webkit-box-shadow: 5px, 5px, 3px, #888888; 
    -moz-box-shadow: 5px, 5px, 3px, #888888; 
    box-shadow: 5px, 5px, 3px, #888888; 
    border-radius: 2em; 
}

然而，當我使用Firebug（或Safari）檢查，選擇僅顯示邊界半徑（它我測試圖像上工作）。

.wp-image-6 { 
    border-radius: 2em; 
}

如果我從瀏覽器中查看的style.css（通過點擊頭部例如style.css文件鏈接），它顯示了造型：

.wp-image-6 { 
    -webkit-box-shadow: 5px, 5px, 3px, #888888; 
    -moz-box-shadow: 5px, 5px, 3px, #888888; 
    box-shadow: 5px, 5px, 3px, #888888; 
    border-radius: 2em; 
}

誰能解釋爲什麼會發生這種情況（盒子陰影不工作）？感謝您的任何幫助。

來源

2014-04-18 MAX Website Design

它沒有顯示在Firebug，因爲這些計算值，不是必然的樣式表。你使用'.wp-image-6'類的元素是什麼？我有一種感覺，這是一個特殊問題。 –

我試了幾個不同的元素。我試圖在任何div，側邊欄和img標籤（上面描述的類的元素）上放置陰影。不適用於任何事情。這些值的計算有什麼關係？此外，我只是試圖包括邊界半徑：'@include border-radius（1em）;'它工作，編譯到style.css文件並更改圖像。它似乎有什麼事情是我的設置覆蓋箱形陰影，不知道，謝謝你的幫助！ –

哦，你知道嗎......這是因爲你有不必要的逗號。試試'@include box-shadow（5px 5px 3px＃888）;'而不是'@include box-shadow（5px，5px，3px，＃888）;' –

在你的mixin中你有逗號，你不需要它們。使用

@include box-shadow(5px 5px 3px #888);

代替：

@include box-shadow(5px,5px,3px, #888);

來源

2014-04-18 21:49:47

謝謝，如果我有足夠的影響力，會投票。 –

從SCSS進行Box-Shadow編譯但未在Firebug中顯示;使用指南針

回答

相關問題