添加自定义字体系列并应用于正文时，不在mac safari上显示字体

Question

在Mac Safari上查看：

在Windows Chrome上查看：

这是css stye

@font-face {
    font-family: Gotham HTF Light;
    src: url(gothamlight.ttf) format("truetype");
    src: url(gotham-black.otf) format("otf");}
@font-face {
    font-family: Gotham HTF Book;
    src: url(gothambook.ttf) format("truetype");
    src: url(gotham-black.otf) format("otf");
}
@font-face {
    font-family: Gotham HTF Medium;
    src: url(gothammedium.ttf) format("truetype");
    src: url(gotham-black.otf) format("otf");
}


html, body {
    text-rendering: optimizeLegibility;
}
body{        
    font-weight:normal;
} 
*{
    font-family:'Gotham HTF Light';
    font-weight: normal;
    font-style: normal;
}
input, select, textarea, button,label{
    font-family:inherit; 
}

  

如果我删除了font-family，那么如何解决这个问题：'Gotham HTF   光';然后它的工作正常但我应用自定义字体它不工作   在表格领域。

Answer 1

User all font format to support all browse and safari too, Try This

@font-face {
    font-family: 'Gotham HTF Light';
    src: url((gothammedium.eot);/* IE9 Compat Modes */
    src: url((gothammedium.eot?#iefix) format('embedded-opentype'),/* IE6-IE8 */       
         url(gothammedium.woff2) format('woff2'), /* Super Modern Browsers */
         url(gothammedium.woff) format('woff'), /* Pretty Modern Browsers */
         url(gothammedium.ttf) format('truetype'), /* Safari, Android, iOS */
         url(gothammedium.svg) format('svg');/* Legacy iOS */
}

Answer 2

我遇到了这个问题，结果发现我使用的.ttf文件存在缺陷。我没有立即意识到这一点，因为在chrome中有效。

要解决该问题，我刚刚下载了其他.ttf文件（可在Safari上使用）。