Question

在我的项目中，我需要使用Gotham Book字体系列，我使用以下代码：

@font-face {
            font-family: 'Gotham Book';
            src: 
                url('assets/fonts/Gotham-Book.eot'),
                url('assets/fonts/Gotham-Book.eot?#iefix') format('embedded-opentype'),
                url('assets/fonts/Gotham-Book.woff2') format('woff2'),
                url('assets/fonts/Gotham-Book.woff') format('woff'),
                url('assets/fonts/Gotham-Book.ttf') format('truetype');
            font-weight: normal;
            font-style: normal;
        }

如果完全适用于Android设备和其他浏览器，除了safari浏览器。请在我的代码中说明错误。

造成这个问题的原因是什么？

我也尝试过使用Gotham Book svg导入，但没有为我工作。

提前谢谢你！

Answer 1

这是有效的解决方案 CSS：

  @font-face {
  font-family: "gotham";
  src: url('ff/Gotham-Book.woff') format('woff'),
       url('ff/Gotham-Book.woff2') format('woff2'),
       url('ff/Gotham-Book.ttf') format('truetype');
  font-weight: normal;
}

并且请通过从URl下面下载字体来替换您现有的字体：

https://drive.google.com/open?id=1pbdpXbPRCJC6Qi-QpNGt7WbLuwtwDRUW

谢谢

Answer 2

尝试添加字体资源的整个网址。

<强> CSS： -

@font-face {
            font-family: 'Gotham Book';
            src: 
                url('https://www.example.com/assets/fonts/Gotham-Book.eot'),
                url('https://www.example.com/assets/fonts/Gotham-Book.eot?#iefix') format('embedded-opentype'),
                url('https://www.example.com/assets/fonts/Gotham-Book.woff2') format('woff2'),
                url('https://www.example.com/assets/fonts/Gotham-Book.woff') format('woff'),
                url('https://www.example.com/assets/fonts/Gotham-Book.ttf') format('truetype');
            font-weight: normal;
            font-style: normal;
        }

由于

'Gotham Book'font-family无法在Safari浏览器和iPhone设备中使用

2 个答案: