字体文件——灰阶渲染，修复字体过粗

＊问题：字体在屏幕上显示的时候需要将字体栅格化为一个个像素点，采用黑白像素点渲染，无法体现字体的细节之处，会造成边缘呈现锯齿状的不平滑。

＊分析：字体渲染引擎的平滑方式：灰阶渲染 和 亚像素渲染。

（1 灰阶渲染是通过控制字体轮廓上 像素点的亮度，达到字体原始形状的方法；
（2 亚像素渲染则利用了 LCD 屏幕中每个像素是由 RGB 三个亚像素的颜色和亮度混合而成一个完整像素的颜色这一原理，将字体上的轮廓点由三个亚像素体现达到原始形状的方法，与灰阶渲染相比，分辨率在垂直方向上放大了三倍，因此，渲染效果更好。但是，所消耗的内存也更多 。

因此在手机屏幕上，为了减少 CPU 的开销，使用灰阶渲染。
在 macOS上，采用的是亚像素渲染这种方式。这就会导致白色、亮色的字体，在深色背景下会显得过粗 ，严重情况下看上去会模糊。 (但是如果是浅色背景下就没有这个反差了)

＊解决：控制浏览器渲染字体的方式

-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: grayscale;