如何向网站添加一些非标准字体?

新手上路,请多包涵

有没有一种方法可以在不使用图像、 Flash 或其他图形的情况下在网站上添加一些自定义字体?

例如,我在一个婚礼网站上工作,我为那个主题找到了很多漂亮的字体。但是我找不到在服务器上添加该字体的正确方法。以及如何将带有 CSS 的字体包含到 HTML 中?这可能没有图形吗?

原文由 vaske 发布,翻译遵循 CC BY-SA 4.0 许可协议

阅读 289
2 个回答

这可以通过 CSS 完成:

 <style type="text/css">
@font-face {
    font-family: "My Custom Font";
    src: url(http://www.example.org/mycustomfont.ttf) format("truetype");
}
p.customfont {
    font-family: "My Custom Font", Verdana, Tahoma;
}
</style>
<p class="customfont">Hello world!</p>

如果您使用 TrueType-Fonts (TTF)、Web Open Font Format (WOFF) 或 Embedded Opentype (EOT) ,则所有常规浏览器都支持 它。

原文由 hangy 发布,翻译遵循 CC BY-SA 4.0 许可协议

您可以通过 Google Web Fonts 添加一些字体。

从技术上讲,字体托管在 Google 上,您可以在 HTML 标头中链接它们。然后,您可以通过 @font-face 在 CSS 中自由使用它们( 阅读相关内容)。

例如:

<head> 部分:

  <link href=' http://fonts.googleapis.com/css?family=Droid+Sans' rel='stylesheet' type='text/css'>

然后在 CSS 中:

 h1 { font-family: 'Droid Sans', arial, serif; }


该解决方案似乎相当可靠(甚至 Smashing Magazine 也将其用作文章标题。 )。然而,目前在 Google 字体目录 中可用的字体并不多。

原文由 Michał Pękała 发布,翻译遵循 CC BY-SA 4.0 许可协议

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题