font-smoothing

font-smoothing是非標準的css渲染規則，由于不同操作系統對字體渲染不同，不同瀏覽器也有自己對樣式的一套解釋規則，所以這個css樣式至今也沒有加入web標準。
這個樣式的主要功能是對字體的鋸齒進行調整。
-webkit-font-smoothing 是webkit在自己的渲染引擎中增加的對字體抗鋸齒的調整。這個調整在ios中表現比較明顯，在windows中表現的不是很明顯。

-webkit-font-smoothing : none

-webkit-font-smoothing: antialiased

-webkit-font-smoothing: subpixel-antialiased;

放大5倍的效果。。。

亞像素渲染是利用紅綠藍三原色互相接近渲染模糊邊緣，詳細的解釋內容戳鏈接，這是瀏覽器的默認渲染方式，他的抗鋸齒強度低于 antialiased。
其實每個操作系統他們對于自體的渲染是由自己的風格的，ios比較喜歡尊重字體的原本設計稿，不管這個字體扭曲到產生多少鋸齒，windows則比較喜歡注重實際，如果按照原設計稿出來的字體產生過多的鋸齒，他會進行調整，忽視設計稿，這也是為什么font-smoothing這個屬性在windows上設置時并沒有太多的差別。戳

亞像素渲染帶來的另一個問題就是相鄰像素的色彩污染，導致字體圖標看上去比較模糊，所以一般還是設置成antialiased進行完全抗鋸齒。
Gecko內核的瀏覽器火狐吧，認識到字體圖標逐漸發展的一個熱潮，也針對ios系統制定了一個渲染規則-moz-osx-font-smoothing: inherit | grayscale
設置grayscale對于圖標字體表現更清晰。