Windows字体呈现@font的问题

我在Windows计算机上遇到了@ font-face的麻烦(无论哪种浏览器)。 它在linux和osx中可以正常工作。

这是我使用的CSS代码(用font-squirel生成)

检查问题的屏幕截图..似乎有2个问题

  • 在窗户上,字体是'跳舞'的。 这些不在基线上对齐。
  • 在Windows上,字体看起来不会反锯齿。
  • 任何人有想法? 提前致谢。

    OSX和Linux屏幕截图:

    http://j3rn.org/images/ob_font1.png

    Windows中的屏幕截图:

    http://j3rn.org/images/ob_font2.png

    CSS代码

    @font-face {
        font-family: 'SchulbuchNordFett';
        src: url(assets/fonts/schulbuchnord-fett-webfont.eot');
        src: url('assets/fonts/schulbuchnord-fett-webfont.eot?#iefix') format('embedded-opentype'),
             url('assets/fonts/schulbuchnord-fett-webfont.woff') format('woff'),
             url('assets/fonts/schulbuchnord-fett-webfont.ttf') format('truetype'),
             url('assets/fonts/schulbuchnord-fett-webfont.svg#SchulbuchNordFett') format('svg');
        font-weight: normal;
        font-style: normal;
    }
    
    @font-face {
        font-family: 'SchulbuchNordNormal';
        src: url('assets/fonts/schulbuchnord-normal-webfont.eot');
        src: url('assets/fonts/schulbuchnord-normal-webfont.eot?#iefix') format('embedded-opentype'),
             url('assets/fonts/schulbuchnord-normal-webfont.woff') format('woff'),
             url('assets/fonts/schulbuchnord-normal-webfont.ttf') format('truetype'),
             url('assets/fonts/schulbuchnord-normal-webfont.svg#SchulbuchNordNormal') format('svg');
        font-weight: normal;
        font-style: normal;
    }
    

    我们有一些与我们的字体类似的问题,我很确定它将“Truetype Hinting”设置为“Keep existing”。

    在这里输入图像描述


    几周前我还面临同样的问题。 我们正在将矢量图形存储在字体文件中,以避免实现单独的图像或css精灵。 一个简单的解决方法是使用例如字体松鼠

    http://www.fontsquirrel.com/tools/webfont-generator

    没有(!)优化选项,它会处理您的字体,以便为网页优化它,有时如果它们不符合某些标准,则会因压缩尝试而中断它。 一个可能的缺点可能是,你的文件变得更大一些。 你也可以试试这个web服务:

    http://fontface.codeandmore.com/indexnew.php

    希望这可以帮助!


    就抗锯齿而言,窗口在呈现精简文本时可能会非常难看。 一个常见的技巧是尝试应用如下的文本描边:

    -webkit-text-stroke: 0.3px
    

    就基本问题而言,这似乎是实际字体的问题。 如果你不喜欢@ font-face,我很偏向于Google Webfonts

    你只需要在头文件中包含一个css链接,然后将相应的字体附加到一个css类中。

    链接地址: http://www.djcxy.com/p/10443.html

    上一篇: Windows font rendering problems with @font

    下一篇: Internet explorer intercepts XML response