css – Google Chrome文本阴影渲染

前端之家收集整理的这篇文章主要介绍了css – Google Chrome文本阴影渲染前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
Google Chrome在实现CSS3文字阴影方面有一个非常令人讨厌的缺陷。当应用文本阴影时,子像素抗锯齿处于关闭状态。没有量的-webkit字体平滑会说服别的。粗α通道抗锯齿导致与字母的阴影混合,并且这与像素化文本一起最终产生非常丑陋的外观。如果使用手写字体(如Monotype Corsiva http://www.newfonts.net/index.php?pa=show_font&id=130),这更加明显

你可以清楚地看到这里的一个地方是在Twitter – http://dev.twitter.com/pages/auth. text-shadow用于文本轮廓:在Chrome浏览页面,与FF或IE相比,你会看到它是多么糟糕。

使用较小的文本,效果变得更糟,直到它使它完全不可读。该问题的技术讨论在这里:http://www.google.com/support/forum/p/Chrome/thread?fid=5d1c0f2082af0f21000483e9a516d36e&hl=en

在Chromium项目中提交了一个错误(问题23440)。这个bug已经有一年多了,还没有分配给任何人。谷歌开发人员看到它,决定它不那么重要,让它老了。原来,他们只是解决了“流行”的错误,一个做法如此跛脚,它看起来令人印象深刻!我对Chrome非常失望! Web排版和CSS3被越来越多的人每天使用,使网络更美丽的地方!这是一个耻辱这样的问题存在,以减缓。

所以,公共努力需要得到这一固定。告诉他人这个,写在你的博客。你可以去http://code.google.com/p/chromium/issues/detail?id=23440并投票的问题。您可以点击左上角的星号(需要某种类型的Google帐户 – gmail等)。

为了使事情更清楚 – 我的问题有两个目标:

>查找技术解决方法
>让Google解决Chrome中的问题。

我将投票每一个链接发表一篇关于这个问题的文章,并标记为被接受的最好的一个技术解决方案或公共努力。

解决方法

@sebastian’s fix可能无法在旧版Chrome中使用。
Iron浏览器(Chromium fork)v3.0.197.0下的屏幕截图:

所有被分配了阴影的阴影看起来一样,-webkit-font-smoothing没有效果,以及-webkit-text-stroke。

相反,我已经尝试,直到我想出了这个修复:http://jsbin.com/acalu4

tldr:添加一个无害0 0 0透明,在你的其他阴影之前。

已知问题:某些浏览器只能处理1个文本阴影。为了不影响他们(杀死他们唯一的阴影),这应该通过javascript只应用于Chrome。

原文链接:https://www.f2er.com/css/222977.html

猜你在找的CSS相关文章