不同苹果设备上的字体呈现方式有所不同。太令人沮丧了
我希望你们中的一些 css 向导可能遇到了我将要描述的问题。
我为客户网站创建了 css3 按钮,以替换他们当前的图像按钮。这些按钮恰好是深色值背景上的浅色字体(红色背景上的白色文本)。
在 OSX 和 iOS 上,quartz 渲染引擎对此有点抓狂,并且对字体进行抗锯齿处理。大胆变得非常非常非常大胆。
奇怪的是,我在 Mac 上开发,无法复制客户端在多个设备上遇到的渲染问题。我确保我只启用了系统字体,我的字体平滑设置相同,等等...
我发现一篇文章建议修复基于 webkit 的浏览器 此处,并将文本与其背景分开,以便只为文本提供不透明度值。
仍然没有骰子。有人知道这里可能有什么问题吗?
示例图片:
I am hoping some of you css wizards might have run into the problem I'm about to describe.
I've created css3 buttons for a clients website, in order to replace their current image buttons. The buttons happen to be a light font face on a dark value background (white text on a red background).
On OSX and iOS, the quartz rendering engine kind of freaks out about this, and anti-aliases the font to death. Bold become really really really bold.
The strange thing is, I develop on a Mac, and cannot replicate the rendering problem the client is having across multiple devices. I've made sure I only have system fonts enabled, that my font smoothing is set the same, etc...
I found an article that suggested a fix for webkit based browsers here, and have seperated the text from it's background in order to give just the text an opacity value.
Still, no dice. Anyone have idea what could be the problem here?
Sample image:
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
我在基于 webkit 的浏览器上遇到了网络字体的粗体问题。我使用以下 CSS 属性来补救它:
似乎是一个比用不透明度来修复字体粗细更好的解决方案......这真的感觉就像一个黑客。
I've encountered bolding issues with web fonts on webkit based browsers. I used the following CSS property to remedy it:
Seems like a better solution than messing with opacity to fix font weights... which really just feels like a hack.