当使用Flash的iframe在页面上时，Webkit字体平滑错误。有解决方法吗？ [英] Webkit font-smoothing bug when iframe with Flash is on page. Is there a work-around?

问题描述

我在Mac上使用Chrome和Safari时遇到了一个令人讨厌的错误。看起来它与字体平滑相关，以及页面是否有一个包含Flash的iframe。

I've ran into a nasty bug with Chrome and Safari on Mac. It appears that its related to font-smoothing and whether or not the page has an iframe with Flash inside of it.

当我删除iframe时，文本看起来像是设置为 font-smoothing：subpixel-antialiased 默认）。但是当iframe在页面上时（Flash在其中运行），文本似乎设置为 font-smoothing：antialiased 。

When I remove the iframe the text looks like it is set to font-smoothing: subpixel-antialiased (browser default). But when the iframe is on the page (with Flash running inside of it) the text appears to be set to font-smoothing: antialiased.

有没有解决方法？请参阅下面的屏幕截图。

Is there any work-around for this? Please see screenshots below.

推荐答案

我想我找到了一个ok解决方案。我有一个div，它与Flash内部的iframe略有重叠。这重叠的div有它的字体平滑拧紧。要修复它，我只是把z-index在iframe和重叠的div。为了使它工作，iframe必须在div（高z-index）的顶部。在上面的例子中，没有任何东西与iframe重叠，但每个元素的边界可能会轻微重叠。您可以在Safari或Chrome中使用网络检查器来查看。但是我只是把z-index放在iframe和那些乱乱了字体平滑的元素上。

I think I found an "ok" solution. I had a div that was slightly overlapping an iframe that had Flash inside of it. That overlapping div had it's font-smoothing screwed up. To fix it I just had to put z-index on both the iframe and the overlapping div. To make it work the iframe has to be on top of the div (higher z-index). In the example above it doesn't appear that anything is overlapping the iframe, but the boundary of each element could be overlapping slightly. You'd be able to see it by using the web inspector in Safari or Chrome. But I'd just start by putting z-index on the iframe and the elements that have messed up font-smoothing.

这篇关于当使用Flash的iframe在页面上时，Webkit字体平滑错误。有解决方法吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！