这一点已经明确指出:在iOS移动版游戏中指定ttf字体呈现font-weight:bold
,使用iOS 4.2 / 4.3 Beta 3或更高版本的iphone / ipad打开演示版网站:
(这是来自谷歌字体的Reenie + Beanie)
您会看到粗体字体外观双重渲染。这对于中小字体大小并不重要,但对于大字体大小/缩放来说非常重要
我的朋友会将这个错误报告给苹果。但是,他能做些什么来解决这个bug? (杀掉文字调整不确定)
更新: 这个在iOS5中不固定。
我知道的最佳解决方案是
font-weight:normal
(如演示所示)-webkit-text-strok
e或text-shadow
使其看起来“粗体”(加上仅限iPad的css - js添加的正文前缀,而不仅仅是媒体查询)答案 0 :(得分:34)
与h1
从父类继承font-weight: bold;
时遇到同样的问题。只需用font-weight: normal;
答案 1 :(得分:26)
似乎Mobile Safari有一种错误的渲染方式faux styles with font-faces。对于粗体,它会使文本和偏移加倍,而对于大多数字体,它会被忽视,但是对于较薄的字体,它看起来就像是双重视觉。
在您的情况下,Reenie Beanie 不包含粗体,如果您将它们用作标题而未将font-weight
更改为normal
或400
它会使大胆的重量“仿造”。
请注意,使用虚假样式通常是buggy in some browsers,而不仅仅是在Mobile Safari中。
font-weight
所以最好的解决方案是将字体权重更改为Google字体提供的字体权重,快速修复如下:
h1, h2, h3, h4, h5, strong, b {
font-weight: 400;
}
/* or font-weight: normal */
另一个解决方案是从确实包含粗体样式的网络字体存档中选择一种字体。谷歌字体中的替代品看起来很像Reenie Beanie并且“更大胆”将是例如Gochi Hand,Sunshiney或Permanent Marker。
如果你真的坚持想要一种虚假的大胆风格,你可以尝试使用瘦text-shadow或text stroke。
答案 2 :(得分:7)
请勿使用“大胆”或“粗体”标记。如果您使用特定的加权网页,则不需要它们。
我遇到了同样的问题。当我删除任何提到的font-weight时,它就消失了。
答案 3 :(得分:6)
尝试应用此css规则:
-webkit-font-smoothing: antialiased;