font-weight：太字を700の代わりに500にすることはできますか？

Question

私はちょうどGoogle Fontsで遊んでいて、Fira Sansフォントを見つけました。いいですが、私はBold（700）スタイルが好きではありません。好みには大胆です。しかし、Medium（500）スタイルを選択した場合、ブラウザはfont-weight: bold（たとえば<strong>）に設定されたものには使用しません。代わりに、それはぼやけて見えるいくつかの種類の偽の太字を使用します。

私は自分のスタイルシートを調べ、boldのすべての出現を500に設定できます。私はSassを使って$bold-weight: 500;のような変数を設定して、後でフォントを変更することができれば助かります。

しかし、痛みのビットですが、プラスboldも多くのブラウザのスタイル（例えば<strong>、<th>）のデフォルトですので、私は、私はあまりにもの可能なすべての発生を捕まえることを確認する必要があります。そして、私が制御しない外部のスクリプト/スタイルがあるかもしれません。

すべての出現をbold使用重量500にする方法はありますか？

Answer 1

クイック使用するには、Googleのフォントを選択するとはい、

、あなたがそこに、ヘッダに含まれるようにリンクを提供するWebブラウザにリンクを開いて、CSSファイルで提供されますされています

/* cyrillic-ext */ 

@font-face { 
    font-family: 'Roboto'; 
    font-style: italic; 
    font-weight: 400; 
    src: local('Roboto Italic'), local('Roboto-Italic'), url(https://fonts.gstatic.com/s/roboto/v15/WxrXJa0C3KdtC7lMafG4dRTbgVql8nDJpwnrE27mub0.woff2) format('woff2'); 
    unicode-range: U+0460-052F, U+20B4, U+2DE0-2DFF, U+A640-A69F; 
} 

のたくさんのあなたがfont-style: italicとfont-weight: 400はあなたがfont-weight: 400（またはnormal）でfont-weight: italicを使用するときの意味、@font-faceタグ内にいくつかの特定のフォント（ここでRoboto斜体）とリンクして、それが参照する見ることができるようにsr内に記述されているフォントc属性。

あなたのCSSのfont-weight: boldにすべてこのフォントを使用させる場合は、上記のfont-styleの400をboldに変更するだけです。

また、完全な@ font-face {..}を複製して別のフォントスタイルを使用することもできます。

また、異なるフォントも使用できます。 @ font-face内にfont-styleタグまたはfont-weightタグを1つだけ保持してください。

ここでは、Googleのフォントを使用していますが、自己ホストフォントにも同じ手法を使用できます。