1

見出しなどの単純なアプリケーションにsIFRをうまく使用しました。2 つの異なるフォントを同時に使用しようとしています。1 つは見出し用、もう 1 つはメニュー用です。
見出しは機能しますが、メニューは機能しません。Tofurious Wordpressテーマを使用しています。これは、メニュー フォントとリンク スタイルを管理するテーマのスタイルシートのセクションです。

/*MENU COLORS****************/
#menu {
 background:#bc7d90;
}

#menu li a {
 font:11px Arial, Helvetica, sans-serif; /*MENU FONT STYLES*/
 text-transform: uppercase;
 color:#fff; /*MENU FONT COLOR*/
}

#menu li a:hover {
 color:#ecd1d9; /*MENU FONT COLOR WHEN HOVERING*/
}

sIFR設定ページで#menu li aとして入力しItem To Replace、次のコードを使用しました。

.sIFR-root { font-size:15px; font-weight:normal; color:#fff; }
a { text-decoration:none; color:#fff; }
a:hover { color:#fff; }

フォントは表示されますが、上記で指定したスタイルのいずれでも表示されず、ブログに予期しない方法で表示されます。このアドレスで例を見ることができます: www.laurenparkinson.com/blog

また、実際のサブメニュー項目はまったく表示されません。

4

1 に答える 1

0

バージョン 4 以降、IE を含むすべての主要なブラウザーでサポートされている @font-face の sIFR を完全に捨てることで、大きな恩恵を受けることができます (詳細な互換性情報: http://webfonts.info/wiki/index.php?title =@font-face_browser_support )。


@font-face {
 font-family: myFont1;
 src: url('myFont1.eot'); /*For IE*/
 src: local('myFont1'), url('myFont1.ttf') format('truetype');
}
@font-face {
 font-family: myFont2;
 src: url('myFont2.eot'); /*For IE*/
 src: local('myFont2'), url('myFont2.ttf') format('truetype');
}

#header{
 font-family: myFont1, Georgia, Times New Roman, Serif;
}

#menu {
 font-family: myFont2, Verdana, Arial, Sans-serif;
}

フォントが埋め込み用にライセンスされていることを確認してください。

オンラインeotコンバーター: http://www.kirsle.net/wizards/ttf2eot.cgi

于 2010-01-29T09:45:09.010 に答える