@font-face ie problems

前端 未结 4 1390
猫巷女王i
猫巷女王i 2020-12-19 17:27

I have tried a few different ways to include the correct fonts in the CSS. I know that I need the eot version for the font to work on IE, but I can\'t get it to recognize i

4条回答
  •  萌比男神i
    2020-12-19 18:16

    You need to set Access-Control-Allow-Origin HTTP Header for this
    See here:
    IE9 blocks download of cross-origin web font


    Does this work?

    @font-face {
        font-family: 'BebasNeue';
        src: url('fonts/BebasNeue.eot');
        src: url('fonts/BebasNeue.eot?#iefix') format('embedded-opentype'),
             url('fonts/BebasNeue.otf') format("opentype");
    }
    

    On Fontsquirrel they do it this way
    http://www.fontsquirrel.com/fontfacedemo/bebas-neue

    Download the @font-face kit from there

    @font-face {
        font-family: 'BebasNeueRegular';
        src: url('/utils/load_demo_font.php?font=960/BebasNeue-webfont.eot');
        src: url('/utils/load_demo_font.php?font=960/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
             url('/utils/load_demo_font.php?font=960/BebasNeue-webfont.woff') format('woff'),
             url('/utils/load_demo_font.php?font=960/BebasNeue-webfont.ttf') format('truetype'),
             url('/utils/load_demo_font.php?font=960/BebasNeue-webfont.svg#BebasNeueRegular') format('svg');
        font-weight: normal;
        font-style: normal;
    
    }
    

提交回复
热议问题