如何在博客中嵌入我的字體？

我試圖在我的博客網站中嵌入字體，但是當我在另一臺PC上測試它時沒有在該PC上安裝字體，它不起作用。如何在博客中嵌入我的字體？

這是我的博客地址：ann24h.com

我的字體是定位在另一個託管：http://kesor168.com/sub/font/

<style> 
@font-face { 
font-family: Khmer OS Dangrek; 
src: url(http://kesor168.com/sub/font/Khmer_OS_Dangrek.eot); 
src: url(http://kesor168.com/sub/font/Khmer_OS_Dangrek.ttf); 
} 
@font-face { 
font-family: Khmer OS Battambang; 
src: url(http://kesor168.com/sub/font/Khmer_OS_Battambang.eot); 
src: url(http://kesor168.com/sub/font/Khmer_OS_Battambang.ttf); 

} 
</style>

不知道如何解決我的CSS？

來源

2017-02-24 Jessica Noly

你需要你的名字值對有正確的語法。在font-family屬性需要"Example Font Name"（單或雙引號都很好）不Example Font Name

您目前只有一個.eot和.ttf字體文件。其中只支持Android或iOS上的IE9和Safari。如果您有針對您的.eot文件的IE修補程序，那麼您可能會獲得對IE6-IE8的支持。

@font-face { 
    font-family: 'Khmer OS Battambang'; 
    src: url('http://kesor168.com/sub/font/Khmer_OS_Battambang.eot'); 
    src: url('http://kesor168.com/sub/font/Khmer_OS_Battambang.eot?#iefix') format('embedded-opentype'), 
     url('http://kesor168.com/sub/font/Khmer_OS_Battambang.ttf') format('truetype') 
}

將它應用到你的整個頁面：

html, body { 
    font-family: 'Khmer OS Battambang', sans-serif; 
}

我上面有一個例子，你可以很容易地通過使用例如讓你的其他字體面。

編輯：你問你會什麼添加一行所以它會在谷歌瀏覽器回答工作：添加下面

url('Khmer_OS_Battambang.woff2') format('woff2'), 
url('Khmer_OS_Battambang.woff') format('woff'),

的「woff2」兩條線適用於真正的新的現代瀏覽器。
'woff'通常適用於現代瀏覽器。

當然，您需要將.woff和.woff2文件放在與其他字體相同的目錄中。同樣在我提供的例子中，我只指定了文件，你需要指定目錄。

來源

2017-02-24 03:04:23

如果我需要支持谷歌瀏覽器，我應該添加什麼行？ –

我編輯了我的答案，以便您可以添加對被歸類爲現代瀏覽器的Google Chrome的支持。 –

如何在博客中嵌入我的字體？

回答

相關問題