CSS3 設置特殊字體的方法@font-face

問題：
在開發過程中我們經常在設計圖 中看到一些特殊字體，這些字體並不是系統自帶的字體，那要怎麼引用特殊字體呢？？
兼容性 ：
IE9 只支持 .eot 類型的字體, Firefox, Chrome, Safari, 和 Opera 支持 .ttf 與.otf 兩種類型字體.
注意： IE 8 及更早IE版本不支持@font-face 規則.

簡單上手的使用過程：
1.先看文件放置位置，這裏font文件夾下有一個PWChal.ttf 字體，並且是TrueType格式。


設置css @font-face

<style>
        @font-face{
            font-family: myFirstFont;   //'myFirstFont'是自己起得特殊字體的名稱
            src: url(font/PWChalk.ttf) format('truetype'); //url(引入字體路徑，相對和絕對路徑都可以，路徑正確就可以了，)；format（字體類型）
            font-weight:100;
             font-style:normal;
        }
        .fonts{
            font-size: 30px;
            font-family: myFirstFont;  // 給dom設置特殊字體font-family：值就是上邊自己爲特殊字體起的名稱
        }
    </style>

html代碼

<div class="fonts">HelloWord!00888999</div>

參考鏈接：https://blog.csdn.net/cddcj/article/details/77506408

簡單介紹@font-face語法規則：

@font-face {
      font-family: YourWebFontName;
      //src: <source> [<format>],<source> [<format>];
      src: url('fontName.woff') format('woff'),
          url('fontName.ttf') format('truetype'),
          url('fontName.svg#fontName') format('svg');
      font-weight: <weight>;
      font-style: <style>;
    }

font-family: <YourWebFontName> ：自定義字庫名稱（一般設置爲所引入的字庫名），後續樣式規則中則通過該名稱來引用該字庫。
src ：設置字體的加載路徑和格式，通過逗號分隔多個加載路徑和格式   （多個字體類型的話還可以分成很多個@font-face 單個單個命名字體名稱）
srouce ：字體的加載路徑，可以是絕對或相對URL。
format ：字體的格式，主要用於瀏覽器識別，一般有以下幾種——truetype,opentype,truetype-aat,embedded-opentype,avg等。
font-weight 和 font-style 和之前使用的是一致的。 
src屬性後還有一個 local(font name) 字段，表示從用戶系統中加載字體，失敗後才加載webfont。

src: local(font name), url("font_name.ttf")

詳細講解 ：
語法規則，兼容瀏覽器，字體格式說明，字體下載網站參考鏈接 https://www.cnblogs.com/moqiutao/archive/2015/12/23/5070463.html 均有詳細介紹