【发布时间】:2012-02-07 23:39:56
【问题描述】:
我似乎有一个问题,即 Firefox 在白色背景上显示 0.75 不透明度的模糊文本阴影很好,但在 Webkit 和 Opera 中它太暗/太脆了。谁是对的?是什么赋予了?我应该如何尝试解决它?谢谢。
注意事项:
这是一个例子JSFiddle
实际上,问题似乎出在图像处理过滤器的选择上。火狐版本似乎最模糊,其次是 Opera,然后是 Chrome/Safari (Webkit)。几乎看起来 Webkit 浏览器正在使用某种盒子过滤器来进行模糊处理,而 Firefox 正在使用更平滑的东西。 Webkit 中的阴影似乎太清晰了。
【问题讨论】:
-
这只是它在不同浏览器中的工作方式......另外,如果你在 windows 中使用 webkit,它往往看起来比在 mac 中更清晰。
-
你不应该担心这些事情。他们都支持它,这取决于他们是否正确实施它。毕竟它们是不同的浏览器。
-
问题是使用不同的(实际的网络字体)阴影只会使整个字体看起来很难看且难以阅读(这是我的客户提出的)。我确实可以选择减轻我的阴影(我会这样做),但我从来没有真正理解这个问题,直到我意识到我是在 Firefox 中而不是在 Chrome/Safari 中盯着它。当这些实现细节确实很重要时,说“我不应该担心它”有点愚蠢。这就像告诉我不要担心字体抗锯齿。
-
此外,我什至不确定什么行为是正确的,或者它是否只是在要求中未指定。我希望不必深入研究规范并从我的开发人员同事那里收集我能做的事情。但由于这似乎是一个小问题,我可能不得不这样做。
-
嗯,这里的重点是,在向客户端显示任何内容之前,请确保它在所有必需的浏览器中都是可读的。所有的浏览器都遵循 box-shadow 规范,它们只是使用不同的方法来达到相同的结果,但显然有细微的差别。根据我的经验,Firefox 总是有最好的 css3 输出。字体看起来更好,阴影和边框半径看起来更平滑。另一方面,Chrome,至少在 Windows 上,总是看起来有点差,但是,嘿,webkit 比任何其他引擎都有更多的功能。