FontFamilyにこだわってみました

FontFamilyにこだわってみました

このたびfont-familyの設定にこだわってみました。
日本語フォントにつきましても、さまざまな種類があって、見ているだけでも楽しい♪♪
クリエイティブ心が刺激されますねぇ~。是非下記サイトアクセスしてみてください。

【出展 – 英字フォント】

Google Fonts

Google社からが無料で提供されていますWebフォント。サーバから読み込んで使用することができます。

【出展 – 日本語フォント】

Google Fonts + 日本語 早期アクセス

こちらは、現時点で完全にはサポートしていないフォントを試験的に提供しているという、安定したオープンソース ディレクトリです。

今回 こちらのサイト (http://cimodade.com/LP/)に
英字「Loto」
日本語文字「NotoSansJapanese」
を設定してみました。

うぇぶしごとAkiWebWorks

スタイルシートへはこのように記述します。

@import url('https://fonts.googleapis.com/css?family=Lato:400,900');
@import url('https://fonts.googleapis.com/earlyaccess/notosansjapanese.css');
body {
  font-family: 'Lato', 'Noto Sans Japanese', '游ゴシック Medium', '游ゴシック体', 'Yu Gothic Medium', YuGothic, 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, 'MS Pゴシック', 'MS PGothic', sans-serif;
}

Google Fonts提供のライブラリを適応したいサイト内に読み込みます。
それから、(body全体への指定の場合)上記のように記述します。
ライブラリのパスは、フォントごとに記載されています。

Google Fonts Loto

〇囲みの箇所をクリックすると、詳細が別窓で表示され参照することができるようになっています。

Google Fonts Loto

できました!