开发者

@font-face not working on a client site?

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 开发者_JAVA技巧i ensure my path is right?


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!


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


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.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜