1.-webkit-font-smoothing控制的字体渲染只对MacOS webkit有效。 因此,在MacOS测试环境下设置-webkit-font-smoothing时,只要不设置为none,再好看的属性也可以设置。 反正这个属性只针对macOS,在其他情况下不会出错(none的情况除外)。
2、控制字体渲染的前端接口非常匮乏。 如果可能,请尝试控制输出字体而不是控制字体渲染。
3、下面的测试会显示-webkit-font-smoothing只在MacOS上有效。
① 窗户
测试环境:Win7 Pro + Chrome:
结论:-webkit-font-smoothing 属性在 Windows 系统上没有影响。
② 苹果
测试环境:iPad Air + ios7 + Safari
(ios上没有Hiragino Sans GB,不要被标签误导!)
结论:在ios上音乐音效,修改-webkit-font-smoothing属性,结果为:
-webkit-字体平滑:无; 没有抗锯齿
· -webkit-font-smoothing:抗锯齿 | 亚像素抗锯齿 | 默认; 灰度平滑
③苹果操作系统
测试环境:MBP + Safari:
结论:在ios上,修改-webkit-font-smoothing属性,结果为:
-webkit-字体平滑:无; 没有抗锯齿
-webkit-font-smoothing:subpixel-antialiased | 默认; 亚像素平滑
· -webkit-font-smoothing:抗锯齿; 灰度平滑
4.字体抗锯齿技术
字体抗锯齿技术可以分为以下几类:
黑白渲染:现已绝迹
· 灰度渲染:Android、ios等常用移动设备
· 亚像素平滑:常见于 Mac OS 和 MacType For Windows
ClearType:黑白渲染和子像素平滑之间的折衷。 WinXP内置音乐,默认关闭; win7及以上默认打开
理想造型:黑白渲染; 灰度渲染。
亚像素平滑技术的原理unity抗锯齿,从右向左看unity抗锯齿,注意一个像素中的渐变。
5、从不同平台浏览器的字体渲染对比,我们可以看出附图的端倪:
6. 下表是我综合各方面资料得出的结果。 欢迎指正: