-webkit-font-smoothing:antialiased;属性

https://www.zhihu.com/question/21158747

作者：康康
链接：https://www.zhihu.com/question/21158747/answer/18984343
来源：知乎
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

CSS3中设置字体的抗锯齿或光滑度的属性。最常用的有3个：1. “none” 用于小像素的文本；2. “subpixel-antialiased” 浏览器默认；3. “antialiased” 反锯齿。

在 MacBook Pro 上的显示效果如下:

<img src="https://i-blog.csdnimg.cn/blog_migrate/6793cf2a8457c3f99585d6771fc0850b.png" data-rawwidth="1352" data-rawheight="819" class="origin_image zh-lightbox-thumb" width="1352" data-original="https://pic4.zhimg.com/v2-df61fe41f43c7bab0e28ea07a57fd537_r.png">

一图胜千言 :3

果壳网的 antialiased 是让字体在 MacBook、surface 等 retina 屏幕上看起来更光滑，但是 在 Windows 下的 chrome 中却会导致文字很难看清，所以如果要用的话，这里的坑需要注意。

另外个人觉得针对小字体使用 “none” 可读性会更高，但使用小字体的时候也需要注意 "中文版的 PC(Win+Mac) 下的 chrome 有12像素的最小字体限制"(又一个坑: 中文版Chrome浏览器不支持12px以下字体的解决方案)。