hiyoko-programingの日記

プログラミングを勉強したてのひよっ子。   エンジニア目指して勉強中。

フォントの設定 1

Google Fonts

 https://www.google.com/fonts/

で利用する。

操作方法等が適宜リニューアルされているので、

現在は、以下のサイトを参考にするのがわかりやすかと思われる。

    https://sodamelo.com/google-fonts/

 

簡単に順序を説明すると、

①カテゴリを選択。(サーチする系統を狭める。※1)

②自分の使いたい言語を選択。

③その変更させたいテキストをボックスに記入。

④「+ select this style 」で右に「 selected family 」が表示されるので、そのすぐ下にある「 Embed 」を選択。

⑤「 @import 」をセレクトし、グレーバックにある、コードを@import~をすべてコピーし(※2)、CSS( style.css )の一番上に貼り付ける。

⑥もうひとつ下にあるグレーバックは、

フォントのコード指定ソースなので、

変更したい該当するタグに、

コードをコピーして貼り付ける。

 

※1検索する際に全てだと多いので、フォントカテゴリーだけでも絞る。

  ⚫︎ Serif                明朝系フォント 

  ⚫︎ Sans Serif     ゴシック系フォント

  ⚫︎ Display           装飾的なフォント

  ⚫︎ Handwriting  筆記体のフォント

 

※2 <stlye>  </style> は必要ない。