Chrome与Firefox上文本呈现的主要区别

Naa*_*tan 8 css firefox fonts google-chrome antialiasing

我在Chrome和Firefox之间的文本呈现方面存在一些重大差异.Chrome似乎对文本应用了一些抗锯齿规则,并将其缩小了很多.

我尝试过使用-webkit-font-smoothing,字母间距和字间距但似乎没有任何效果.

查看截图

在Chrome上呈现

相关CSS(计算):

color: #C4C4C4;
font-family: sans-serif;
font-size: 9px;
font-style: normal;
font-variant: normal;
font-weight: normal;
Run Code Online (Sandbox Code Playgroud)

在Firefox上渲染

相关CSS(计算):

font-family:    sans-serif;
font-size:  9px;
font-weight:    400;
font-style: normal;
font-size-adjust:   none
color:  #C4C4C4;
text-transform: none;
text-decoration:    none;
letter-spacing: normal;
word-spacing:   0;
line-height:    11.0833px;
text-align: start;
vertical-align: baseline;
direction:  ltr;
Run Code Online (Sandbox Code Playgroud)

请注意,背景中的淡化文本只是一个图像..忽略它.

我有一种感觉Chrome有一个用于消除锯齿规则的css开关,但不知道在哪里可以查找更多信息.

编辑:

jsfiddle:http://jsfiddle.net/mHzhQ/

为了记录,我在Ubuntu上.可能这会产生影响..

有小费吗?

oro*_*ome 4

不同的浏览器使用不同的渲染引擎(旨在)产生不同的结果。对于较小的字体尤其如此。通常您对此无能为力。如果这种差异不是浏览器设计者有意为之的,那么这也很可能是在其他操作系统上解决的一个问题,但不是在您的操作系统(Ubuntu)上解决的。

\n\n

(也就是说:您是否检查了 Chrome \xe2\x80\x94 首选项 > 引擎盖下 > 自定义字体... \xe2\x80\x94 和 Firefox \xe2\x80\x94\xc2\xa0Preferences 中的“最小字体大小” > 内容?)

\n