如何在 HTML 站点上安装自定义字体 [英] How do I install a custom font on an HTML site
问题描述
我没有使用 flash 或 php - 我被要求向简单的 HTML 布局添加自定义字体.《KG六月虫》
I am not using flash or php - and I have been asked to add a custom font to a simple HTML layout. "KG June Bug"
我已将其下载到本地 - 是否有简单的 CSS 技巧来完成此操作?
I have it downloaded locally - is there a simple CSS trick to accomplish this?
推荐答案
是的,您可以使用名为 @font-face 的 CSS 功能.它只在 CSS3 中得到正式批准,但在 CSS2 中被提出并实现,并且在 IE 中得到了相当长的支持.
Yes, you can use the CSS feature named @font-face. It has only been officially approved in CSS3, but been proposed and implemented in CSS2 and has been supported in IE for quite a long time.
您可以像这样在 CSS 中声明它:
You declare it in the CSS like this:
@font-face { font-family: Delicious; src: url('Delicious-Roman.otf'); }
@font-face { font-family: Delicious; font-weight: bold; src: url('Delicious-Bold.otf');}
然后,您可以像其他标准字体一样引用它:
Then, you can just reference it like the other standard fonts:
h3 { font-family: Delicious, sans-serif; }
所以,在这种情况下,
<html>
<head>
<style>
@font-face { font-family: JuneBug; src: url('JUNEBUG.TTF'); }
h1 {
font-family: JuneBug
}
</style>
</head>
<body>
<h1>Hey, June</h1>
</body>
</html>
而且你只需要将 JUNEBUG.TFF 放在与 html 文件相同的位置.
And you just need to put the JUNEBUG.TFF in the same location as the html file.
我从 dafont.com 网站下载了字体:
I downloaded the font from the dafont.com website:
http://www.dafont.com/junebug.font
这篇关于如何在 HTML 站点上安装自定义字体的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!