フラットデザイン風Webフォントと使い方

フォントファイルを配布しているサイト
M+ FONTS
M+ OUTLINE FONTS | DOWNLOAD

解凍コマンド

tar Jxvf mplus-TESTFLIGHT-057.tar.xz

展開されたフォルダをCSSファイルが置かれているフォルダ等へ配置

CSSファイルへの記載方法

@font-face {
	font-family:mplus-1p-light;
	src:url("../mplus-TESTFLIGHT-057/mplus-1p-light.ttf") format("truetype")
}

#body
{
	font-family: 'mplus-1p-light' , sans-serif;
}

font-faceとは
CSS3でのフォント指定文。ウェブ上のフォントファイルが使える。

参考
http://www.adobe.com/jp/devnet/dreamweaver/articles/html5pack_css3_part4.html