IE11 CSS3114：@ font-face失败的OpenType嵌入权限检查

Question

在IE11中，我的字体无法正确加载。我认为这是我打电话给他们的方式。

@import url('https://fonts.googleapis.com/css?family=Roboto');
            @font-face {
                font-family: Bebas;
                src: url("{% static 'publicnfx/fonts/BebasNeue Regular.tff' %}"),
                     url("{% static 'publicnfx/fonts/BebasNeue Regular.otf' %}");
            }

BebasNeue Regular.otf是未加载的字体。它适用于所有其他浏览器，例如Firefox，Chrome，Edge，但不适用于IE11及以下版本。

错误：

更新：

我在网上找到了该解决方案，但对我却不起作用：

@import url('https://fonts.googleapis.com/css?family=Roboto');
            @font-face {
                font-family: Bebas;
                src: url("{% static 'publicnfx/fonts/BebasNeue Regular.tff' %}");
                src: url("{% static 'publicnfx/fonts/BebasNeue Regular.eot?#iefix' %}") format('eot'),
                     url("{% static 'publicnfx/fonts/BebasNeue Regular.otf' %}"),
                     url("{% static 'publicnfx/fonts/BebasNeue Regular.woff' %}") format('woff'),
                     url("{% static 'publicnfx/fonts/BebasNeue Regular.ttf' %}") format('truetype'),
                     url("{% static 'publicnfx/fonts/BebasNeue Regular.svg' %}") format('svg'),
            }

这很可能是由于我的字体文件夹中只有.ttf和.otf。

Answer 1

导致此问题的原因是我没有为Internet Explorer使用正确的字体格式。

Internet Explorer在字体末尾使用字体格式.eot。在我的情况下，我使用的字体没有.eot文件格式，必须让别人替我将.ttf重新格式化为.eot。

然后，我只是使用新的文件格式向该字体添加了一个新网址：

@import url('https://fonts.googleapis.com/css?family=Roboto');
    @font-face {
        font-family: Bebas;
        src: url("{% static 'publicnfx/fonts/BebasNeue Regular.tff' %}"),
             url("{% static 'publicnfx/fonts/bebas-neue-bold.eot' %}"),
             url("{% static 'publicnfx/fonts/BebasNeue Regular.otf' %}");
    }