在HTML页面中添加自定义字体

Question

我想向HTML电子邮件模板添加自定义字体。 我将字体上传到服务器上以及所有内容上...但是我认为我在某个地方犯了一个错误。 下面是代码。

<tr>
<td align="center" mc:edit="title1">
<style type="text/css">

@font-face {  
    src: url('http://www.screenmedia.mk/EmailMarketing/00PEDANTIX.TTF');
    src: url('http://www.screenmedia.mk/EmailMarketing/00PEDANTIXBOLD.TTF');
}

h6 { 
    font-family: 00PEDANTIX;

}
</style>

<h6 class="h6 t bold" style="font-family: 00PEDANTIX; src: url('http://www.screenmedia.mk/EmailMarketing/00PEDANTIX.TTF'); font-weight: 700;color: #fff;font-size: 20px;line-height: 15px;margin: 0 0 8px !important; p   adding-left: 80px;"><singleline label="title1">SILVER</singleline></h6>

- >

<tr>
<td align="center" mc:edit="title1">
<style type="text/css">

@font-face {
font-family: 00PEDANTIX;
src: url('http://www.screenmedia.mk/EmailMarketing/00PEDANTIX.TTF');
}
@font-face {
font-family: 00PEDANTIXBOLD;
src: url('http://www.screenmedia.mk/EmailMarketing/00PEDANTIXBOLD.TTF');
font-weight: bold;
}

h6 {

font-family: 00PEDANTIX;
}

</style>

<h6 class="h6 t bold" style="font-family: 00PEDANTIX; font-weight: 700;color: #fff;font-size: 20px;line-height: 15px;margin: 0 0 8px !important; padding-left: 80px;"><singleline label="title1">SILVER</singleline></h6>
<table width="60" border="0" cellspacing="0" cellpadding="0" style="border-collapse: collapse;"><tbody>
<tr>

</tr></tbody>
</table>
</td>
</tr>

编辑：

 <tr> <td align="center" mc:edit="title1"> <style type="text/css"> @font-face { font-family: 00PEDANTIX; src: url('http://www.screenmedia.mk/EmailMarketing/00PEDANTIX.TTF'); } @font-face { font-family: 00PEDANTIXBOLD; src: url('http://www.screenmedia.mk/EmailMarketing/00PEDANTIXBOLD.TTF'); font-weight: bold; } h6 { font-family: 00PEDANTIX; } </style> <h6 class="h6 t bold" style="font-family: 00PEDANTIX; font-weight: 700;color: #fff;font-size: 20px;line-height: 15px;margin: 0 0 8px !important; padding-left: 80px;"><singleline label="title1">SILVER</singleline></h6> <table width="60" border="0" cellspacing="0" cellpadding="0" style="border-collapse: collapse;"><tbody> <tr> </tr></tbody> </table> </td> </tr> 

Answer 1

您必须在@ font-face规则中定义字体系列。 另外，您只能为每个@ font-face定义一个权重

@font-face {
font-family: 00PEDANTIX;
src: url('http://www.screenmedia.mk/EmailMarketing/00PEDANTIX.TTF');
}
@font-face {
font-family: 00PEDANTIXBOLD;
src: url('http://www.screenmedia.mk/EmailMarketing/00PEDANTIXBOLD.TTF');
font-weight: bold;
}

编辑：没有读到它是用于电子邮件模板的。 您还不能在电子邮件中加载自定义字体。 如果需要使用该字体，唯一的方法是通过图像。

Answer 2

有时浏览器会花费一些时间或不支持Web字体。

尝试使用http://www.fontsquirrel.com/tools/webfont-generator生成字体外观代码，该代码可在大多数浏览器中使用。

它们将为webkit，mobile，IE和mozilla生成不同版本的字体（OTF，TTF等）。

...及其免费！！！

Answer 3

任何浏览器的某些版本均不支持ttf字体。 您可以咨询您的浏览器是否与此网站兼容。 我可以使用