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问题

回答

相关问题