@ font-face问题 [英] @font-face issue

查看:108
本文介绍了@ font-face问题的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

你好社区!

我目前正在自己​​公司的网站上工作,面对工作正常。
这是css的样子:

I am currently working on our own firms web site and I can't seem to get the @font-face to work properly. This is what the css looks like:

@font-face {
    font-family: 'BebasNeue';
    src: url('type/BebasNeue-webfont.eot?') format('eot'),
         url('type/BebasNeue-webfont.woff') format('woff'),
         url('type/BebasNeue-webfont.ttf') format('truetype'),
         url('type/BebasNeue-webfont.svg#webfontj1CI1MAi') format('svg');
}

#nav li {
    display: inline;
    margin-left: 20px;
    font-family: BebasNeue, Impact;
    font-size: 24px;
    color: #333333;
    letter-spacing: 1pt;
    }

@ font-face import基本上是直接从Font Squirrel @ font-面发生器。我还没有找到什么错,这就是为什么我伸出援手。
我编辑了字体家族名称和字体的位置(../ type /).

The @font-face import is basically straight from the Font Squirrel @font-face generator. I haven't yet found out whats wrong and thats why I'm reaching out. I edited the font-family names and the location of the fonts (../type/).

任何帮助,请告诉我,如果你需要以查看可能与此问题相关的任何其他代码。
Cheers。

Any help is appreciated, tell me if you need to see any other code that might be relevant to this issue. Cheers.

推荐答案

据我所知,这是最通用的方式来实现@ font-face :

to the best of my knowledge, this is the most universal way to implement @font-face:

@font-face{
    /* for IE only (IE doesn't apear to comprehand normal CSS)*/
    font-family: "my fancy font";
    src: url("/fonts/font.eot");
}

@font-face{
    /* for non CSS-challenged browsers */
    font-family: "my fancy font";
    src: local("☼"),
        url("/fonts/font.eot") format('eot'),
        url("/fonts/font.woff") format('woff'),
        url("/fonts/font.otf") format('otf'),
        url("/fonts/font.ttf") format('truetype'),
        url("/fonts/font.svg") format('svg');
}

两个@ font-face部分和不可能是文件名在src:local()

two @font-face sections and something that can't possibly be a filename in src: local()

这篇关于@ font-face问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆