2011-03-08 82 views
1

我試圖簡單地嵌入一個字體,我已經上傳到我的服務器。CSS3字體嵌入

一切正在正確加載,但錯誤的字體正在顯示。我知道這是因爲當我刪除@ font-face代碼時,呈現的HTML字體會發生變化。

這是我的代碼,我在過去一個小時裏玩過很多不同的東西,所以大家可以大聲說出你認爲可能有用的東西。我也試過.TTF文件。

@font-face { 
    font-family: Joan; 
    src: url("../fonts/joan.otf") format('font/opentype'); 
} 
body { 
    background: url('../images/bg.gif'); 
    font-family: Joan; 
} 
+0

您使用的是什麼瀏覽器? .otf在Internet Explorer中不起作用。 – ghoppe 2011-03-08 16:32:13

+0

哦,不,我沒有使用IE。 Chrome和FF4 – 2011-03-08 16:34:57

+0

請參閱Pixel2Pixel Design上的本教程http://www.pixel2pixeldesign.com/css3-font-embedding-html/ – 2011-08-13 08:37:45

回答

1

您可能必須將字體名稱放在引號中。另外,對於MSIE兼容性,您需要將字體轉換爲.eot格式。這是「防彈」@ font-face per paulirish.com。您可能需要根據全/ PostScript字體名稱調整:

@font-face { 
    font-family: 'Joan'; 
    src: url('../fonts/joan.eot'); 
    src: local('Joan Regular'), local('Joan'), 
     url('../fonts/joan.otf') format('opentype'); 
}