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

我试图在我的博客网站中嵌入字体，但是当我在另一台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的支持。 –

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

回答

相关问题