その場合は"userContent.css"を使用して下さい。 普段からこれを利用してない場合はabout:configで"toolkit.legacyUserProfileCustomizations.stylesheets"の値を"true"にして下さい。 古いバージョンから引き継いでるプロファイルであれば上記の値は"true"になっていますが、バージョン69以降で新規に作成したプロファイルだと標準では"false"で無効化されているので有効化されてるか確認して下さい。書き方としては
@font-face { font-family: "サイト側指定のフォント"; src: local("置き換えるフォント"); font-weight: ウェイト; }
になります。3つの項目については、サイト側指定のフォントは言葉通りサイトの方で指定されてるフォントの名前です。windows環境だとメイリオとかですね。サイトによっては同じフォントでも"メイリオ"と日本語名で指定してる場合と"meiryo"と英語名で指定してる場合が有るので注意です。 置き換えるフォントは自分が使用したいフォントの名前をpostscript名で指定します。使うフォントのpostscript名は検索して調べて下さい。 ウェイトはサイト側が指定するフォントの太さで、普通のサイトは標準と太めの2種類を指定してる場合が殆んどなので"normal"と"bold"の2つになります。上記を1つとして
@font-face { font-family: "サイト側指定のフォント(日本語名)"; src: local("置き換えるフォント(標準)"); font-weight: normal; }
@font-face { font-family: "サイト側指定のフォント(英語名)"; src: local("置き換えるフォント(標準)"); font-weight: normal; }
@font-face { font-family: "サイト側指定のフォント(日本語名)"; src: local("置き換えるフォント(太い)"); font-weight: bold; }
@font-face { font-family: "サイト側指定のフォント(英語名)"; src: local("置き換えるフォント(太い)"); font-weight: bold; }
の様に1つのフォントに対して4つ書きます。置き換えるフォントが複数のウェイトを1つのファイルに纒めた物であれば"font-weight"の部分は省いて指定フォントの日本語名と英語名の2つで済みますが、そちらが普段の利用で挙げてるフォントの様に標準と太めでファイルが分かれてるフォントだと個別に指定することになるので上記の4つになります。 ウェイトは凄く細かく指定してるサイトは稀なので2種類あれば大丈夫でしょう(そもそもwindowsがウェイトの豊富なフォントを標準で持ってないので、そこを細かくしたいサイト側はwebフォントを使う) 普段閲覧してる適当なサイトを開いて開発ツールからインスペクター、フォントの項目の"ページ内のすべてのフォント"を開き@font-faceの所を押して目的のフォントとウェイトが正しく置き換わっているか確認して下さい。オプションの"ウェブページが指定した〜"の項目をオンに戻すのも忘れずに。取り敢えずこれで通常は好みのフォントで表示してサイト側がwebフォントを指定してる場合はそちらが読み込まれるのを両立出来ます。
windows環境だと"メイリオ"と"游ゴシック"それと更新が止まってる古いサイトの閲覧用に"ms pゴシック"の3つを置き換えれば困らないでしょう。それと英数字部分だけ日本語と別のフォントを指定してるサイトも多いのでそれも置き換えたければ個別に書く必要が有ります。
1つのフォントに対して複数書くことになるのであれもこれもと置き換えると長くなっていきます。もっとスマートな書き方が有るかもしれませんが自分はあまり詳しくないので、その辺は他のもっと詳しい方にお任せします。
その場合は"userContent.css"を使用して下さい。 普段からこれを利用してない場合はabout:configで"toolkit.legacyUserProfileCustomizations.stylesheets"の値を"true"にして下さい。 古いバージョンから引き継いでるプロファイルであれば上記の値は"true"になっていますが、バージョン69以降で新規に作成したプロファイルだと標準では"false"で無効化されているので有効化されてるか確認して下さい。書き方としては
@font-face { font-family: "サイト側指定のフォント"; src: local("置き換えるフォント"); font-weight: ウェイト; }
になります。3つの項目については、サイト側指定のフォントは言葉通りサイトの方で指定されてるフォントの名前です。windows環境だとメイリオとかですね。サイトによっては同じフォントでも"メイリオ"と日本語名で指定してる場合と"meiryo"と英語名で指定してる場合が有るので注意です。 置き換えるフォントは自分が使用したいフォントの名前をpostscript名で指定します。使うフォントのpostscript名は検索して調べて下さい。 ウェイトはサイト側が指定するフォントの太さで、普通のサイトは標準と太めの2種類を指定してる場合が殆んどなので"normal"と"bold"の2つになります。上記を1つとして
@font-face { font-family: "サイト側指定のフォント(日本語名)"; src: local("置き換えるフォント(標準)"); font-weight: normal; }
@font-face { font-family: "サイト側指定のフォント(英語名)"; src: local("置き換えるフォント(標準)"); font-weight: normal; }
@font-face { font-family: "サイト側指定のフォント(日本語名)"; src: local("置き換えるフォント(太い)"); font-weight: bold; }
@font-face { font-family: "サイト側指定のフォント(英語名)"; src: local("置き換えるフォント(太い)"); font-weight: bold; }
の様に1つのフォントに対して4つ書きます。置き換えるフォントが複数のウェイトを1つのファイルに纒めた物であれば"font-weight"の部分は省いて指定フォントの日本語名と英語名の2つで済みますが、そちらが普段の利用で挙げてるフォントの様に標準と太めでファイルが分かれてるフォントだと個別に指定することになるので上記の4つになります。 ウェイトは凄く細かく指定してるサイトは稀なので2種類あれば大丈夫でしょう(そもそもwindowsがウェイトの豊富なフォントを標準で持ってないので、そこを細かくしたいサイト側はwebフォントを使う) 普段閲覧してる適当なサイトを開いて開発ツールからインスペクター、フォントの項目の"ページ内のすべてのフォント"を開き@font-faceの所を押して目的のフォントとウェイトが正しく置き換わっているか確認して下さい。オプションの"ウェブページが指定した〜"の項目をオンに戻すのも忘れずに。取り敢えずこれで通常は好みのフォントで表示してサイト側がwebフォントを指定してる場合はそちらが読み込まれるのを両立出来ます。
windows環境だと"メイリオ"と"游ゴシック"それと更新が止まってる古いサイトの閲覧用に"ms pゴシック"の3つを置き換えれば困らないでしょう。それと英数字部分だけ日本語と別のフォントを指定してるサイトも多いのでそれも置き換えたければ個別に書く必要が有ります。
1つのフォントに対して複数書くことになるのであれもこれもと置き換えると長くなっていきます。もっとスマートな書き方が有るかもしれませんが自分はあまり詳しくないので、その辺は他のもっと詳しい方にお任せします。
|