私は以前にこれを行ったことがありますが、まだそれを習得していません。fontsquirrel.comからフォントキットをダウンロードし、カスタムフォントを自分のサイトで機能させるようにしました。私はオンラインで見つけた「防弾」方法を含む非常に多くのバリエーションを試したので、今では混乱しています。誰かが以下のコードを見て、@ font-faceを使用してWebサイトでカスタムフォントを正しく機能させる方法を教えてもらえますか？
cssという名前のフォルダーにfonts.cssという名前のスタイルシートがあります。これは、カスタムフォントを呼び出すために使用されています。フォントファイルは、fontsという名前のルートからのフォルダにあります。
スタイルシートフォントのCSSは次のとおりです。
@font-face {
font-family: 'BebasNeueRegular';
src: url('../fonts/bebasneue-webfont.woff') format('woff'),
url('../fonts/bebasneue-webfont.ttf') format('truetype'),
url('../fonts/bebasneue-webfont.webfontABYyK1dn') format('svg');
font-weight: normal;
font-style: normal;
レイアウトなどの他のスタイルシートは、次のようにフォントを呼び出します。
}
#merchandise h1 {
font-family: "Bebas Neue", Arial, Helvetica, sans-serif;
font-size: 33px;
font-weight: normal;
line-height: normal;
text-transform: uppercase;
letter-spacing: 1px;
}
明らかなことはありますか？もちろん、フォントがインストールされているので、私のマシンではローカルで動作します。