css - 如何为所有浏览器嵌入 ttf 格式的自定义网站字体？

Question

在我的网站上，我使用的是我上传的自定义字体。它似乎在选择何时间歇性地工作。它适用于某些计算机/浏览器，但不适用于其他计算机/浏览器。它也被正确映射。

这是我的代码：

<style type="text/css">
@font-face {
    font-family: 'AgencyFBRegular';
    src: url('agencyr.eot');
    src: url('agencyr.eot?#iefix') format('embedded-opentype'),
         url('agencyr.woff') format('woff'),
         url('AGENCYR.TTF') format('truetype'),
         url('agencyr.svg#AgencyFBRegular') format('svg');
}


h3 {    font-family: 'Agency FB', sans-serif; font-size: 26px; font-weight:normal; text-align: left; line-height: 100%;
    border-bottom: 1px solid #484848; padding-bottom: 5px; margin-bottom:7px; 
</style>

在我使用朋友的笔记本电脑查看之前，我认为它无处不在。

你能看出我哪里错了吗？

更新：我更新了字体 CSS。它似乎可以工作，但现在不在 iOS 上。

Answer 1

以下代码应该可以工作：

@font-face {
    font-family:"AgencyFBRegular";
    src: url("agencyr.eot") /* EOT file for IE */
}
@font-face {
    font-family:"AgencyFBRegular";
    src: url("agencyr.ttf") /* TTF file for CSS3 browsers */
}

h3 {
    font-family:'Agency FB', sans-serif;
    font-size: 26px;
    font-weight:normal;
    text-align: left;
    line-height: 100%;
    border-bottom: 1px solid #484848;
    padding-bottom: 5px;
    margin-bottom:7px;
}

Answer 2

您需要更改没有大写字体的文件名。像这样：从AGENCYR.TTF到agencyr.ttf

并在您的 css 文件中：

src: url('agencyr.ttf');