html - 如何在网站上使用自定义字体？

Question

为了让我的网站看起来不错，我需要使用自定义字体，特别是 Thonburi-Bold。问题是 - 除非用户安装了字体，否则字体不会显示。它也不显示在Firefox中。

这个问题有解决方法吗？

score 107 · Accepted Answer

您必须像这样在样式表中导入字体：

@font-face{
    font-family: "Thonburi-Bold";
    src: url('Thonburi-Bold.ttf'),
    url('Thonburi-Bold.eot'); /* IE */
}

score 12 · Accepted Answer

您可以使用 CSS3font-face或 webfonts

@font-face 用法

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

网页字体

看看 Google Webfonts，http://www.google.com/webfonts

score 8 · Accepted Answer

CSS 允许您在您的网站上使用自定义字体、可下载字体。您可以下载您喜欢的字体，比如说myfont.ttf，然后将其上传到托管您的博客或网站的远程服务器。

@font-face {
    font-family: myfont;
    src: url('myfont.ttf');
}

score 8 · Accepted Answer

是的，有办法。它在 CSS 中称为自定义字体。您的 CSS 需要修改，并且您需要将这些字体上传到您的网站。

为此所需的 CSS 是：

@font-face {
     font-family: Thonburi-Bold;
     src: url('pathway/Thonburi-Bold.otf'); 
}

score 1 · Accepted Answer

首先，您必须将字体作为 .otf 或 .ttf 放在服务器上的某个位置。

然后使用 CSS 声明新的字体系列，如下所示：

@font-face {
    font-family: MyFont;
    src: url('pathway/myfont.otf'); 
    }

如果将文档链接到声明字体系列的 CSS 文件，则可以像使用任何其他字体一样使用该字体。

5 回答 5