網頁中導入特殊字體@font-face屬性詳解

@font-face {
	font-family: 'icomoon';/*自定義字體名稱*/
	src:url('../fonts/icomoon.eot?rretjt');/*自定義字體的路徑*/
	src:url('../fonts/icomoon.eot?#iefixrretjt') format('embedded-opentype'),
		url('../fonts/icomoon.woff?rretjt') format('woff'),/*format為字體格式 便於瀏覽器識別*/
		url('../fonts/icomoon.ttf?rretjt') format('truetype'),
		url('../fonts/icomoon.svg?rretjt#icomoon') format('svg');
	font-weight: normal;/*屬性是否加粗*/
	font-style: normal;/*是否傾斜屬性*/
}

 @font-face是CSS3中的一個模塊，他主要是把自己定義的Web字體嵌入到你的網頁中，這個自定義的字體IE瀏覽器同樣支持。

字體的格式：

   1.TureTpe(.ttf)格式：
　　.ttf字體是Windows和Mac的最常見的字體，是一種RAW格式，因此他不為網站優化,支持這種字體的瀏覽器有【IE9+,Firefox3.5+,Chrome4+,Safari3+,Opera10+,iOS Mobile Safari4.2+】；
2.OpenType(.otf)格式：
　　.otf字體被認為是一種原始的字體格式，其 內置在TureType的基礎上，所以也提供了更多的功能,支持這種字體的瀏覽器有 【Firefox3.5+,Chrome4.0+,Safari3.1+,Opera10.0+,iOS Mobile Safari4.2+】；
3.Web Open Font Format(.woff)格式：
　　.woff字體是Web字體中最佳格式，他是一個開放的TrueType/OpenType的壓縮版本，同時也支持元數據包的分離,支持這種字體的瀏覽器有【IE9+,Firefox3.5+,Chrome6+,Safari3.6+,Opera11.1+】；
4.Embedded Open Type(.eot)格式：
　　.eot字體是IE專用字體，可以從TrueType創建此格式字體,支持這種字體的瀏覽器有【IE4+】；
5.SVG(.svg)格式：
　　.svg字體是基於SVG字體渲染的一種格式,支持這種字體的瀏覽器有【Chrome4+,Safari3.1+,Opera10.0+,iOS Mobile Safari3.2+】。