css - 字体在 Windows 中看起来失真

Question

我正在用 ubuntu 做一个网站，并完成了 UI 部分。在 ubuntu 中一切都运行顺利，但是当我打开 Windows 时，所有字体都失真了。我尝试了以下代码

@font-face {
    font-family: 'garrisonsb';
    src: url('../fonts/garrisons-bold.eot');
    src: url('../fonts/garrisons-bold.eot?#iefix') format('embedded-opentype'),
         url('../fonts/garrisons-bold.woff') format('woff'),
         url('../fonts/garrisons-bold.ttf') format('truetype'),
         url('../fonts/garrisons-bold.svg#garrison_sansbold') format('svg');
    font-weight: bold;
    font-style: normal;

}

@font-face {
    font-family: 'garrisons';
    src: url('../fonts/garrisons-regular.eot');
    src: url('../fonts/garrisons-regular.eot?#iefix') format('embedded-opentype'),
         url('../fonts/garrisons-regular.woff') format('woff'),
         url('../fonts/garrisons-regular.ttf') format('truetype'),
         url('../fonts/garrisons-regular.svg#garrison_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'rupee';
    src: url('../fonts/Rupee.eot');
    src: url('../fonts/Rupee.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Rupee.woff') format('woff'),
         url('../fonts/Rupee.ttf') format('truetype'),
         url('../fonts/Rupee.svg#rupeeregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

指定的代码是使用 squirrel-generator 生成的。我尝试将 font-smooth 属性设置为“始终”，并将 -webkit-font-smoothing 设置为抗锯齿，字体粗细也指定为 700(常规)和 900(粗体)而不是“正常”，但没有任何效果。

请提出最佳解决方案......

Answer 1

Web 字体在所有浏览器中都不是流畅的。对于 web-kit 浏览器，您可能必须使用 -webkit-font-smoothing: antialiased。

你最好使用 text-shadow: 0px 0px 1px #GOOD-COLOR-HERE 或 text-shadow: 0px 0px 1px rgba(COLOR-SETTINGS-HERE) 和调整颜色设置和阴影以获得最佳效果。