IE Problem with True Type Font

问题:

I intalled a new font on my website but I cannot get IE8 and IE9 to recognize, I have no knoledge on how the browsers render the fonts, but my css style sheet font declaration is as follows,

@font-face {     


font-family: VAGRounded;     src: url("../fonts/VAGRoundedW01-Light.eot") /* EOT file for IE */

 src:url("../fonts/VAGRoundedW01-Light.eot?#iefix") format('embedded-opentype');


 }

@font-face {  font-family: VAGRounded;  src: url("../fonts/VAGRoundedW01-Light.TTF") format('truetype'),

url("../fonts/VAGRoundedW01-Light.svg#webfontmvIrHXJB") format('svg');

Much help is appreciated!!

回答1:

IE8 and IE9 do not support embedded fonts via the CSS3 scheme without first converting into supported formats (SVG, TT, EOT, etc.). EDIT: IE8 and IE9 requires tweaks to support embedded fonts. See the comments on your question since it's a duplicate.

FYI IE10 will be the first IE browser to support the HTML5 standard.

There are nifty other methods of embedding fonts. The one I recommend is Cufon because it uses VML in older browsers and doesn't require flash.

http://cufon.shoqolate.com/generate/

回答2:

You should consider using a service like Font Squirrel.

It generates all the code for the various browsers.

Output would look something like this

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

http://www.fontsquirrel.com/fontface/generator

回答3:

Try a proper syntax: Fontspring Syntax, Further Hardening of the Bulletproof Syntax, Mo’ Bulletproofer, or Smiley.