2012-03-05 4 views
1

Programmers SEは、トップナビゲーションメニューに「ホワイトボード」フォントを実装しています。programmers.stackexchange.comはどのようにしてnavメニューにカスタムフォントを実装しますか?

テキストは選択可能で、IE7 +、Firefox、Chrome、およびOperaで動作します。テキストがカスタムフォントに変更されるまで少し時間がかかるので、JSベースのようです。

PS:私は、最初の正解を受け入れた回答とマークしました。

答えて

1

これらは単に@font-faceを使用しているようです。私が見る限り、JSは関与していません。 @ font-faceをサポートしていないブラウザでは、代わりにsans-serifフォントが表示されます。

2

ホワイトボードフォントは、CSS2の@Font-Face属性を使用して実装されています。あなたはhere

プログラマSEからあなた自身のウェブサイト上でカスタムフォントを実装する方法の一般的なdiscriptionあなたはすべてに行くことによってこれを確認することができ、「ホワイトボード」フォントが

@font-face { 
    font-family:'WhiteboardRegular'; 
    src: url('img/house-webfont.eot'); 
} 

によって実装される実装を読むことができます。プログラマーのCSS SE

+0

は、この検証をしていますか? –

+1

申し訳ありませんがtatはチェックされていませんが、CSS2の部分以降は検証する必要があります。 – alykhalid

+0

クール、ありがとう。私はそれを確認します。 –

0

CSSでfont-familyを使用し、http://www.google.com/webfontsを使用してページにフォントを読み込みます。

たとえば、これはあなたのCSSの

<link href='http://fonts.googleapis.com/css?family=Seaweed+Script' rel='stylesheet' type='text/css'> 

、これをHTMLに追加します。

body { 
    font-family: 'Seaweed Script', cursive; 
} 
関連する問題