Css IE11@font-face在@media query中使用时失败

我在IE11中使用以下字体（从MyFonts下载）。当按以下方式指定时，它们可以完全加载：

@import url("//hello.myfonts.net/count/myFId"); 
@font-face {font-family: 'HelveticaNeueLTStd-Lt'; src: url('webfonts/myFId_0_0.eot');src: url('webfonts/myFId_0_0.eot?#iefix') format('embedded-opentype'), url('webfonts/myFId_0_0.woff') format('woff'), url('webfonts/myFId_0_0.ttf') format('truetype');}   
@font-face {font-family: 'HelveticaNeueLTStd-Hv'; src: url('webfonts/myFId_1_0.eot');src: url('webfonts/myFId_1_0.eot?#iefix') format('embedded-opentype'), url('webfonts/myFId_1_0.woff') format('woff'), url('webfonts/myFId_1_0.ttf') format('truetype');}

但是，当在媒体查询中指定字体时，字体不会加载到IE11中（无论屏幕分辨率如何）。它只是使用了泰晤士报新罗马版

@import url("//hello.myfonts.net/count/myFId");
@media all and (min-width:800px) {
    @font-face {font-family: 'HelveticaNeueLTStd-Lt'; src: url('webfonts/myFId_0_0.eot');src: url('webfonts/myFId_0_0.eot?#iefix') format('embedded-opentype'), url('webfonts/myFId_0_0.woff') format('woff'), url('webfonts/myFId_0_0.ttf') format('truetype');}
    @font-face {font-family: 'HelveticaNeueLTStd-Hv'; src: url('webfonts/myFId_1_0.eot');src: url('webfonts/myFId_1_0.eot?#iefix') format('embedded-opentype'), url('webfonts/myFId_1_0.woff') format('woff'), url('webfonts/myFId_1_0.ttf') format('truetype');}
}

Firefox和Chrome可以完美地工作。任何地方都没有指定其他字体规则，因此这不是继承问题

这是虫子还是我在做傻事

---

我们的想法是假设便携式设备的连接速度较慢（例如，移动时连接），因此在这些情况下，我们跳过自定义字体，选择通用字体。

我建议采用不同的方法。。。与其指定媒体查询中的字体，我只需调用媒体查询中的字体。。。我相信这个问题是正确的，因为字体应该是全局的，而不是在需要的时候直接调用字体

@import url("//hello.myfonts.net/count/myFId"); 
@font-face {font-family: 'HelveticaNeueLTStd-Lt'; src: url('webfonts/myFId_0_0.eot');src: url('webfonts/myFId_0_0.eot?#iefix') format('embedded-opentype'), url('webfonts/myFId_0_0.woff') format('woff'), url('webfonts/myFId_0_0.ttf') format('truetype');}   
@font-face {font-family: 'HelveticaNeueLTStd-Hv'; src: url('webfonts/myFId_1_0.eot');src: url('webfonts/myFId_1_0.eot?#iefix') format('embedded-opentype'), url('webfonts/myFId_1_0.woff') format('woff'), url('webfonts/myFId_1_0.ttf') format('truetype');}

@media all and (min-width:800px) {
    div {
        font-family: 'HelveticaNeueLTStd-Lt';
    }
}

---

经过进一步研究，我找到了原因和解决方案。
原因是：

样式表中的@import规则必须位于所有规则集之前。一 @遵循一个或多个规则集的导入规则将被忽略。

谢天谢地，这个解决方案既好又简单。通过从样式表中删除媒体查询并将其放在HTML引用中，我实现了这两个要求，还删除了一个额外的

@import

规则：

<link rel="stylesheet" href="/css/fonts.css" media="(min-width:800px)" />

可能复制人：谢谢，但不是复制品。将导入移到媒体查询之外时，问题仍然存在。问题已更新以反映这一点。@norin89的思路是正确的。尝试将您的

@font-face

放入另一个文件，并像其他问题显示的那样导入该文件。但问题是，如果不需要，设备不应下载该字体。这种方法会导致字体总是被下载吗？我希望如此。在这种情况下，我将为字体创建一个外部文件，并在媒体查询中@inport此文件。。。我以前从未尝试过，但这可能是一种选择……这种方法会导致字体无法在所有浏览器中加载。不过，感谢您的意见，因为第二个建议的后续行动在另一个网站上找到了答案。我在下面发布了合适的方法/解决方案，希望它能帮助其他人。只是一些额外的信息：根据，小于800px的设备仍然会下载样式表本身。但是，样式表中声明的CSS将不被应用。