Webkit vs. Firefox與Opera text-shadow問題

我似乎遇到了一個問題，Firefox在0.75白色背景下顯示0.75不透明度的模糊文本陰影，但在Webkit和Opera中它太暗/清晰。誰是對的？是什麼賦予了？我該如何嘗試解決它？謝謝。Webkit vs. Firefox與Opera text-shadow問題

注：

下面是一個例子JSFiddle

事實上，它似乎像這個問題可能是在圖像處理濾波器的選擇。火狐版本看起來很模糊，然後是Opera，然後是Chrome/Safari（Webkit）。它幾乎看起來像Webkit瀏覽器使用某種盒式過濾器來模糊他們，而Firefox則使用更平滑的東西。 Webkit中的影子似乎太簡單了。

來源

2012-02-07 JayC

這只是它在不同瀏覽器中的工作方式......另外，如果您在Windows中使用webkit，它會比在mac中看起來更清晰。 – elclanrs 2012-02-07 23:57:56

你不應該擔心這些事情。他們都支持它，這取決於他們是否正確實施。畢竟他們是不同的瀏覽器。 – Joseph 2012-02-08 00:16:14

問題是使用不同的（實際webfont）陰影只是使整個字體看起來醜陋和難以閱讀（這是由我的客戶提出的）。我確實有選擇減輕我的影子（我會），但是直到我意識到我在Firefox中注意它，而不是在Chrome/Safari中，我才真正理解了這個問題。當這些實現細節確實很重要時，說出「我不應該擔心」是很愚蠢的。這就像告訴我不要擔心字體反鋸齒。 – JayC 2012-02-08 01:35:24

看着http://www.w3.org/TR/css3-text/#changes（W3C工作草案19 2012年1月）

一些穩定少的功能已被推遲到4級：...

...

'text-shadow'上的傳播半徑

所以沒有指定含義。去搞清楚。

在任何情況下，我也（重新）發現，text-shadow接受一個逗號分隔的列表，所以我想，如果我想手動進一步模糊了，如果我本來

text-shadow: 5px 5px 5px rgba(0, 0, 0, 0.75);

我可能會做一些事情像

text-shadow: 4px 4px 5px rgba(0, 0, 0, 0.1875), 
    4px 6px 5px rgba(0, 0, 0, 0.1875), 
    6px 4px 5px rgba(0, 0, 0, 0.1875), 
    6px 6px 5px rgba(0, 0, 0, 0.1875);

根據需要添加陰影。

來源

2012-02-08 02:04:46 JayC

如果我明白你的問題，爲了解決鉻和歌劇的問題，你必須在更高的值上設置模糊半徑，以便在這三個瀏覽器上獲得相同的結果。我知道，因爲我在Firefox和Chrome上使用了盒子陰影，所以我注意到了這一點。

檢查這個活生生的例子：http://css3generator.com/

的Firefox：文字陰影：1px的10px的19px＃050505; chrome and opera：1px 10px 29px＃050505;

來源

2012-02-08 07:08:59 mcmwhfy

問題是，我不知道如何爲不同的瀏覽器設置不同的模糊半徑，而沒有一些主要的詭計。我不確定我的添加多個陰影的建議並不是更好，但它可能需要更多的處理器（尤其是如果我開始爲元素設置動畫效果等） – JayC 2012-02-09 15:34:14

Webkit vs. Firefox與Opera text-shadow問題

回答

相關問題