.ttf 文件应用于网站

Question

所以我有我们正在使用的这些字体。它们是Futura-CondensedBold.ttf、Futura-CondensedMedium.ttf、Futura-Medium.ttf、Futura-MediumItalic.ttf。我实际上有这些字体的文件。我们需要在我们的网站上使用这些。现在我知道如何从 say Google 或 typekit 中使用 link 字体，因为我创建的许多网站都使用这些字体。但是，既然我有实际的字体文件，我该如何让用户从我创建的这个网站下载字体呢？我假设我需要创建一个文件夹，我将在 CSS 目录中创建该文件夹。

Answer 1

只需对 CSS 中的那些文件进行 @font-face 调用。我通常会在 assets 文件夹中放一个 "fonts" 文件夹，并将文件存放在那里。然后只需将 font-face src url 指向该字体文件夹中每个文件类型的位置。

@font-face {
 font-weight: normal;
 font-style: normal;
 font-family: "FONT NAME";
 src: url("../fonts/FAMILY/FONT-NAME.eot");
 src: url("../fonts/FAMILY/FONT-NAME.eot#iefix") format("embedded-opentype"),
   url("../fonts/FAMILY/FONT-NAME.svg#SVGFONTNAME") format("svg"),
   url("../fonts/FAMILY/FONT-NAME.woff2") format("woff2"),
   url("../fonts/FAMILY/FONT-NAME.woff") format("woff"),
   url("../fonts/FAMILY/FONT-NAME.ttf") format("truetype");
}

希望这能回答您的问题。

.ttf 文件应用于网站

.ttf files being applied to website

css

fonts

truetype