使用以前 CSS 的版本，網頁設計師不得不使用使用者計算機上已經安裝的字型。
使用 CSS3，網頁設計師可以使用他/她喜歡的任何字型。
當你發現您要使用的字型檔案時，隻需簡單的将字型檔案包含在網站中，它會自動下載下傳給需要的使用者。
您所選擇的字型在新的 CSS3 版本有關于 @font-face 規則描述。
您"自己的"的字型是在 CSS3 @font-face 規則中定義的。
表格中的數字表示支援該屬性的第一個浏覽器版本号。
屬性
@font-face
4.0
9.0
3.5
3.2
10.0
Internet Explorer 9+, Firefox, Chrome, Safari, 和 Opera 支援 WOFF (Web Open Font Format) 字型.
Firefox, Chrome, Safari, 和 Opera 支援 .ttf(True Type字型)和.otf(OpenType)字型字型類型）。
Chrome, Safari 和 Opera 也支援 SVG 字型/折疊.
Internet Explorer 同樣支援 EOT (Embedded OpenType) 字型.
<b>注意：</b> Internet Explorer 8 以及更早的版本不支援新的 @font-face 規則。
在新的 @font-face 規則中，您必須首先定義字型的名稱（比如 myFirstFont），然後指向該字型檔案。
提示：URL請使用小寫字母的字型，大寫字母在IE中會産生意外的結果
如需為 HTML 元素使用字型，請通過 font-family 屬性來引用字型的名稱 (myFirstFont)：
<style>
{
font-family: myFirstFont;
src: url(sansation_light.woff);
}
div
font-family:myFirstFont;
</style>
您必須添加另一個包含粗體文字的@font-face規則：
src: url(sansation_bold.woff);
font-weight:bold;
該檔案"Sansation_Bold.ttf"是另一種字型檔案，包含Sansation字型的粗體字。
浏覽器使用這一文本的字型系列"myFirstFont"時應該呈現為粗體。
這樣你就可以有許多相同的字型@font-face的規則。
下表列出了所有的字型描述和裡面的@font-face規則定義：
描述符
值
描述
font-family
name
必需。規定字型的名稱。
src
URL
必需。定義字型檔案的 URL。
font-stretch
normal
condensed
ultra-condensed
extra-condensed
semi-condensed
expanded
semi-expanded
extra-expanded
ultra-expanded
可選。定義如何拉伸字型。預設是 "normal"。
font-style
italic
oblique
可選。定義字型的樣式。預設是 "normal"。
font-weight
bold
100
200
300
400
500
600
700
800
900
可選。定義字型的粗細。預設是 "normal"。
unicode-range
可選。定義字型支援的 UNICODE 字元範圍。預設是 "U+0-10FFFF"。