@font-face not working on a client site?

2019-02-18 00:19发布

This is CSS code

@font-face {
    font-family: 'FuturaStdBook';
    src: url('site/font-face/futurastd-medium-webfont.eot');
    src: local('☺'), url('site/font-face/futurastd-medium-webfont.woff') format('woff'), url('site/font-face/futurastd-medium-webfont.ttf') format('truetype'), url('site/font-face/futurastd-medium-webfont.svg#webfont') format('svg');
    font-weight: normal;
    font-style: normal;
}

h2 {font-family:'FuturaStdBook', sans-serif}

Can it be related to mime type?

How can i ensure my path is right?

3条回答
欢心
2楼-- · 2019-02-18 00:37

If you're using IIS, you'll need to register a MIME type for the .eot extension.

  1. In IIS Manager, in the IIS section, open the MIME Types configuration
  2. Under "Actions", click "Add..."
  3. Enter .otf in the extension box, and application/octet-stream in the MIME type box.
  4. Click OK

You'll need to do this for each non-standard extension you use (.ttf is already registered, .woff is not), but that should do it!

查看更多
Explosion°爆炸
3楼-- · 2019-02-18 00:45

Try using Font Squirrel to get a bullet-proof CSS declaration for your custom font.

查看更多
The star\"
4楼-- · 2019-02-18 00:56

The problem are the definitions of font-weight and font-style in your font-face declaration. Since h2 elements are defined in a bold face by default, the font-face declaration is not taken into account for these elements (because the browser thinks, the font file is for normal weighted weight only, which is most probably true).

Solution: You need a second font-face declaration with font-weight: bold in it or you set h2 elements to have font-weight:normal and font-style: normal.

查看更多
登录 后发表回答