*web [#jca802d4]
*Web[#jca802d4]

** webフォントの使い方 [#g6c79ed7]
** webフォント 「Noto Snas Japanese」 [#mb3a60ae]

#ref(notosansjapanese.jpg,,);
#ref(notosansjapanese.jpg,,50%);
[[→無料の日本語フォント【Noto Sans Japanese】があまりにも美しいので、ブログに使ってみた>http://11neko.com/font-2/]]

[[→【Noto Sans Japanese】ブログの記事を綺麗なフォントで表示したいので最軽量化してみた>http://11neko.com/font-3/]]

cssファイルにgoogleからフォントをインポートします
style.cssに以下を追加

 @import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css);

各要素にフォントを適応します(cssの最後に呼び出すとすべてに有効になると思います←確認様までに)

 *{
  font-family: 'Noto Sans Japanese', sans-serif;
  }

Noto Sans Japanesは細いとさらにカッコ良いので、適度にfont-weightを設定しておきます。

  *{
   font-weight: 100;
   font-weight: 200;
   font-weight: 300;
   font-weight: 400;
   font-weight: 500;
   font-weight: 600;
   font-weight: 700;
   font-weight: 800;
   font-weight: 900;
  }

** webフォント 「Source Code Pro」 [#y1619b6f]

#ref(s-sourcecodepro.jpg)

[[https://www.google.com/fonts#UsePlace:use/Collection:Source+Code+Pro ]]



 @import url(http://fonts.googleapis.com/css?family=Source+Code+Pro);

 *{ 
    font-family: 'Source Code Pro';
  }

トップ   新規 一覧 単語検索 最終更新   ヘルプ   最終更新のRSS