@font-face是CSS3中的功能，可以利用它來修改Web網頁中的字體。
@font-face使用的語法規則：
<style type="text/css">
@font-face {
font-family: <YourWebFontName>; // 自定義字體名稱，在后續使用中會用到
src: <source> [<format>][,<source> [<format>]]*; // 字體地址
[font-weight: <weight>]; // 可選，字體粗細
[font-style: <style>]; // 可選，字體樣式
}
tag {
font-family: "YourWebFontName"; // 使用設置的字體名稱在標簽中使用網頁字體
}
</style>
需要注意的幾點：
- 中文字體不建議使用@font-face，字體資源會比較大；
- 字體路徑需要正確，否則沒有效果；
- @font-face只是定義了網頁字體，需要在標簽中使用才有效果；
目前網頁字體有幾種格式：
.ttf格式、.otf格式、.woff格式、.eot格式、.svg格式，不同瀏覽器對于不同格式字體的支持是不一樣的，為了兼容盡量多的瀏覽器，建議字體至少包含eot格式（兼容IE瀏覽器）、woff格式（主流瀏覽器）。
@font-face {
font-family: <YourWebFontName>; // 自定義字體名稱，在后續使用中會用到
src: url('YourWebFontName.eot'),
url('YourWebFontName.woff') format('woff');
}
獲取免費字體的網站：
Google Web Fonts
Dafont.com
在線轉換字體格式網站：
www.fontsquirrel.com
參考博客 CSS3 @font-face
