小编典典

如何在 HTML 网站上安装自定义字体

all

我没有使用 flash 或 php - 我被要求将自定义字体添加到简单的 HTML 布局中。“KG 六月虫”

我在本地下载了它 - 是否有一个简单的 CSS 技巧来完成这个?


阅读 29

收藏
2022-08-05

共1个答案

小编典典

是的,您可以使用名为 @font-face 的 CSS 功能。它只是在 CSS3 中被正式批准,但在 CSS2 中被提出和实现,并且在 IE
中得到了相当长的支持。

你在 CSS 中声明它是这样的:

 @font-face { font-family: Delicious; src: url('Delicious-Roman.otf'); } 
 @font-face { font-family: Delicious; font-weight: bold; src: url('Delicious-Bold.otf');}

然后,您可以像其他标准字体一样引用它:

 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 文件相同的位置。

我从dafont.com网站下载了字体:

http://www.dafont.com/junebug.font

2022-08-05