ほとんどの @font-face ジェネレーターは font-weight と font-style を normal に設定し、下位互換性のために各 weight/style に個別の宣言を使用します。ただし、各バリエーションに同じファミリー名を使用するように宣言を書き直して、必要に応じて各バリエーション内の font-weight と font-style のみを変更することができます。次に例を示します。
@font-face { /* Regular */
font-family: 'Klavika';
src: url('klavika-regular-webfont.eot');
src: url('klavika-regular-webfont.eot?#iefix') format('embedded-opentype'),
url('klavika-regular-webfont.woff') format('woff'),
url('klavika-regular-webfont.ttf') format('truetype'),
font-weight: normal;
font-style: normal;
}
@font-face { /* Bold */
font-family: 'Klavika';
src: url('klavika-bold-webfont.eot');
src: url('klavika-bold-webfont.eot?#iefix') format('embedded-opentype'),
url('klavika-bold-webfont.woff') format('woff'),
url('klavika-bold-webfont.ttf') format('truetype'),
font-weight: bold;
font-style: normal;
}
そのため、H1 は太字の太さを指定せずに継承する必要があります。
h1{ font-family: 'Klavika';}
456 Berea St には、実装 (および互換性) について詳しく説明した良い投稿があります。