Firefox 3.5 on a Mac and @font-face

2019-06-20 02:31发布

问题:

I'm having a problem with @font-face. It actually works flawlessly on Safari, internet explorer 7+ and Firefox for windows but not at all on firefox for mac.

I'm using code from the bulletproof @font-face article

Here's my Code:

@font-face {
    font-family: "QlassikMediumRegular";
    src: url("../fonts/Qlassik_TB.eot");
    src: local("Qlassik Medium Regular"), local("QlassikMedium"), url("../fonts/Qlassik_TB.ttf") format("truetype")
}

@font-face {
    font-family: "QlassikBoldRegular";
    src: url("../fonts/QlassikBold_TB.eot");
    src: local("Qlassik Bold Regular"), local("QlassikBold"), url("../fonts/QlassikBold_TB.ttf") format("truetype")
}

Here is the link to my site in question: link text

回答1:

I typically use a more extended @font-face declaration:

@font-face {
font-family: 'TypewriterOldstyle';
src: url('../fonts/typeo-webfont.eot');
src: url('../fonts/typeo-webfont.eot?#iefix') format('eot'),
     url('../fonts/typeo-webfont.woff') format('woff'),
     url('../fonts/typeo-webfont.ttf') format('truetype'),
     url('../fonts/typeo-webfont.svg#webfonty9r23iiq') format('svg');
font-weight: normal;
font-style: normal;
}

You could try generating at http://www.fontsquirrel.com/fontface/generator



回答2:

Had the same problem, font's gave 301 error saying i did not have access to the font file.

What works best for me is placing the font file's in the same directory as the .css file, no hassle with anny .htaccess or other server config file's.

So i have one external fonts.css file containing all the css font line's within the font directory. Then i can include this .css file on the page i would like to use this font. Make sure you don't make additional directory's so you can call the font without anny directory.

more info: https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face