小编Rad*_*aru的帖子

@ font-face svg在Chrome中无法正常工作?

我对特定字体及其在Chrome中呈现的方式存在问题.

Firefox使用ttf正确显示字体.

Chrome不使用抗锯齿,字体过于"尖锐"且难看.

这是我用过的css声明

@font-face {
    font-family: 'HelveticaNeueLT Std Thin';
    src: url(../fonts/h2.eot);
    src: url(../fonts/h2.svg#test) format('svg'),
         url(../fonts/h2.woff) format('woff'),
         url(../fonts/h2.ttf) format('truetype');
font-weight: normal;
font-style: normal;
}
Run Code Online (Sandbox Code Playgroud)

我得出结论,问题在于svg声明/字体文件.如果我根本不使用散列标记并将其保留为仅仅.svg,则会呈现抗锯齿但在不同的行高处,略微偏离定位.如果我添加.svg#anything,它根本不会消除它并且看起来很难看.

欢迎任何建议,以帮助我解决这个相当恼人的问题.

PS:Windows抗锯齿是可以的,我测试了这个.我也尝试过@media screen and (-webkit-min-device-pixel-ratio:0)svg字体的声明,没有成功.我意识到这可能是一个转贴,但尝试了相关问题的所有解决方案,我有点绝望.在此输入图像描述

css svg google-chrome truetype font-face

17
推荐指数
3
解决办法
2万
查看次数

标签 统计

css ×1

font-face ×1

google-chrome ×1

svg ×1

truetype ×1