问题

在做Ghost主题时想沿用默认主题的字体样式，但发现替代为阿里的图标文件后，qq图标显示不出来

解决办法

找到

text-rendering: geometricPrecision;

修改为

text-rendering: auto;

引申

Text-rendering 属性是一个非标准属性，主要用来告诉渲染引擎（rendering engine）渲染文字的时候如何来优化，浏览器根据这个属性来权衡速度、易读性、几何精度等方面。

暂时只有Gecko（Firefox）and WebKit（Safari 或 Chrome）支持这个属性。

Text-rendering属性有如下取值：

• auto

  浏览器为速度、易读性、几何精度等自动优化来绘制文本
  在实践中，Gecko桌面浏览器（Firefox）如果字体大小为20 px或者更大，会使用optimizeLegibility；否则对于较小的文本使用optimizeSpeed

• optimizeSpeed

  绘制文本时速度优先，会禁用字距调整和连字

• optimizeLegibility

  绘制文本时易读性优先，会启用字距调整和连字

• geometricPrecision

  绘制文本时几何精度优先，暂时和optimizeLegibility相同

参考：http://www.feeldesignstudio.com/2013/05/text-rendering/

若您觉得我的博文对您有帮助，欢迎点击下方按钮对我打赏

打赏