html - 不同操作系统/不同机器的字体不一致

Question

我使用的是“Populaire”字体。我有一个奇怪的问题。

当我在笔记本电脑上查看字体时，字体清晰地形成，没有任何失真(在所有浏览器上)但是当在其他系统上看到相同的字体时(不是所有但很少有系统)，它开始出现失真(再次，在所有浏览器上)浏览器)。我不确定什么会导致某些系统中的字体失真。请指教。这是我在代码中使用的 CSS。

@font-face {
font-family: 'Populaire';
src: url('font/populaire.eot');
src: url('font/populaire.eot?#iefix') format('embedded-opentype'),
     url('font/populaire.woff') format('woff'),
     url('font/populaire.ttf') format('truetype'),
     url('font/![enter image description here][2]populaire.svg#populaire') format('svg');
}

h1 {
font-family: 'Populaire','Helvetica neue',Helvetica,Arial,sans-serif;
font-size: 2em;
font-weight:lighter;
color: #ffffff;
background-color: #8D407C;
width:250px;
margin: 0;
padding: 0;
}

Answer 1

第二个屏幕截图中的类型显示时没有消除锯齿。这可能是因为第二台计算机没有启用 Cleartype。

http://www.microsoft.com/typography/cleartype/tuner/step1.aspx

在 Windows Vista、Windows 7 和 OSX 中，默认启用 Cleartype(或等效的抗锯齿引擎)。

如果没有抗锯齿，任何没有特别提示屏幕显示的字体都会出现“锯齿状”，因为它的曲线不能很好地适应屏幕的像素网格。