font face not working in ie

问题

I have created a html layout and using css3 @font-face. Here is my code

@font-face {
    font-family: 'MyriadProRegular';
    src: url('myriad.eot');
    src: url('myriad.eot?#iefix') format('embedded-opentype'),
         url('myriad.woff') format('woff'),
         url('myriad.ttf') format('truetype'),
         url('myriad.svg#MyriadProRegular') format('svg');
}

and i am using

font-family: 'MyriadProRegular';

it's work in all browsers accept IE. Please help.

回答1:

I can't recommend Font Squirrel enough for this. Just run through their Font Face generator and you'll get code that will work in IE. If you're missing a font file type it even makes that for you. It's saved me a lot of time in the past and I can't recommend it enough.

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

This is from Font Squirrel and works cross browser:

@font-face {
    font-family: 'NimbusSanConD-Lig';
    src: url('fonts/228BFB_1_0.eot');
    src: url('fonts/228BFB_1_0.eot?#iefix') format('embedded-opentype'),
         url('fonts/228BFB_0_0.woff') format('woff'),
         url('fonts/228BFB_0_0.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

回答2:

are svg, woff and eot even (supported) font types? I'm pretty sure .svg is not and I've never heard of .woff and .eot.. Just a truetype should work in all browswers. (I'm not sure about Macintosh though)

the way font-face always works for me:

@font-face {
    font-family:alba;
    src:url(alba.ttf);
}

So no quotes used here. What I'd suggest to also try for your case, is to do it like

@font-face {
        font-family:Myriad Pro Regular;/* note the whitespaces, I believe this is what the font itself is called (not the filename) */
        src:url(myriad.ttf);
    }

Make sure you always mind the difference between uppercase and lowercase letters! If the font file is called Myriad.ttf while you type myriad.ttf, it might not work in some browser(version)s.

来源：https://stackoverflow.com/questions/11029181/font-face-not-working-in-ie

标签

internet-explorer

css3

font-face