2013年3月5日火曜日

GoogleWebFontsの無料フォントを使う

Google Web Fonts はオープンソースのフォントを集めたwebサービスです。すべてのフォントが無料で使えます。Webアプリの開発に便利です。

まず Google Web Fonts を開きます。
http://www.google.com/webfonts



フォントの一覧が表示されるので、使いたいフォントの Add to Collection ボタンをクリックします。
画面上のタブで表示が切り替えられます。
Word は単語を表示、 Sentenceは1行を表示、Paragraphは段落の表示、Posterはフォント名の表示です。
また Preview Text: にテキストを入力するとプレビューに反映されます。

使いたいフォントのボタンを押したら画面右下の Use ボタンをクリックします。



使用したいスタイルにチェックを入れます。



Add this code to your website と書かれた部分にHTMLタグが表示されるので自分のウェブサイトの<header>タグ内にコピペしましょう。
更にその下に フォントを使うためのCSSが書かれているのでこちらもコピーします。フォントを使いたい要素の font-family をこちらに変更することでフォントが適用されます。



0 件のコメント:

コメントを投稿