web-dev-qa-db-ja.com

IE8でCSS @ font-faceが機能しない

IEでカスタムフォントを処理する方法に関する複数の記事を読んでみましたが、それらは私には役に立たなかったようです。フォントをEOTに変換しようとしましたが、うまくいかないようです。何が間違っているのかわからないので、コードを投稿します

@font-face {
  font-family: "Klavika Regular";
    src: url('../fonts/klavika.eot');
    src: local('☺'), url('../fonts/klavika.woff') format('woff'), url('../fonts/klavika.ttf') format('truetype'), url('../fonts/klavika.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}
27
hackshockr

これはie8/9で動作します

http://dev.bowdenweb.com/a/fonts/serif/alegreya/demo.html

@font-face {
    font-family: 'AftaserifRegular';
    src: url('AftaSerifThin-Regular-webfont.eot');
    src: url('AftaSerifThin-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('AftaSerifThin-Regular-webfont.woff') format('woff'),
         url('AftaSerifThin-Regular-webfont.ttf') format('truetype'),
         url('AftaSerifThin-Regular-webfont.svg#AftaserifRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}
40
albert

iE8 思考が以下にリストされているもののうちeot以外の他のフォーマットをサポートしている場合、おそらくそれを使用しようとします。たぶん、あなたはIE8のハックを使うことができます

src: local('☺'), url('../fonts/klavika.woff') format('woff'), url('../fonts/klavika.ttf') format('truetype'), url('../fonts/klavika.svg') format('svg');
src /*\**/: url('../fonts/klavika.eot')\9

iE8のみが最後のsrc行を読み取り、.eotをロードします。

0
Naoise Golden

FontSquirrel Generator で@ font-faceの3種類のCSS形式を試してください(「EXPERT ...」モードで>セクション「CSS形式:」>「詳細」)

0
fine

.htaccessファイルでファイルタイプが許可されているかどうかを確認する価値があります。

0
magicspon