为什么IE10的“IE8标准”模式与IE9的不同？

Question

为什么IE10的“IE8标准”模式与IE9的不同？

htmlinternet-explorer-9font-faceinternet-explorer-10

7

我有以下HTML代码：

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="X-UA-Compatible" content="IE=8" />
        <link href='https://fonts.googleapis.com/css?family=Bitter:400' rel='stylesheet' type='text/css'/>

        <style type="text/css">

        h1 {
            font-family: Bitter;
            font-weight: normal;            
        }
        </style>
    </head>
    <body>
        <h1>Why is this different?</h1>
    </body>
</html>

在 Windows 7 的 IE9 中查看时，Bitter 字体被正确加载并应用： HTML on IE9 Windows 7

但在 Windows 8 的 IE10 中查看时，它没有被加载，而是回退到默认字体（Times New Roman）： HTML on IE10 Windows 8

由于 X-UA-Compatible 元标签的存在，两个浏览器都使用相同的文档模式，因此我本以为两者将同时具有 Bitter 字体或失败并回退到 Times New Roman 字体。然而，一个可以正常工作（Windows 7 上的 IE9），而另一个失败了（Windows 8 上的 IE10）。

这是已知问题还是记录功能？

- Andy Smith

2

因为微软选择这样做。 - user330315

因为信息技术需要变革。 - Ravindra Bagale

我不明白你在问什么。你是要让它以IE8的方式呈现，对吗？ <meta http-equiv="X-UA-Compatible" content="IE=8" /> 那么区别可能在于默认字体大小的设置，因为你没有做任何补偿。 - MetalFrog

1

@MetalFrog，就像Patrick所说的那样：）这些字体是不同的字体，我尝试过指定大小，但它并没有改变Bitter/Times New Roman之间的差异。我期望它看起来相同的原因是我正在使用相同的文档模式。我已经编辑了我的问题以提供进一步的清晰度。 - Andy Smith

1

@Patrick 我可以确认在IE8文档模式下，这确实适用于IE10。我看到你使用了font suirrel，很想知道他们是如何做到让它工作的！ - Andy Smith

显示剩余13条评论

4个回答

5

如果字体在IE8中实际上无法工作，那么听起来IE10比IE9具有更好的兼容性引擎-因为它实际上正确地呈现了IE8的内容。

为什么IE9 Compat 8会显示字体，而字体在IE8中不起作用？我认为这是字体文件的问题。@font-face似乎存在许多问题-其中之一是字体属性设置问题。见：为什么其中一个@font-face在IE8中呈现，而其他字体却不呈现？。

下载字体后，通过Font Squirrels生成器进行处理，并使用自己的@font-face代码本地托管字体文件集，您报告称该字体在IE10 Compat 8中可以工作。我可以确认它在所有Compat模式下的IE9以及IE7/8中也可以工作。

苦字体在IE10兼容模式下与由Font Squirrel生成的字体文件/代码一起使用。

既然你已经声明其他谷歌字体在IE9/10 Compat模式8中都可以工作，我认为这真正证实了问题出在字体文件本身上 - 以及IE在某些情况下似乎存在的属性问题。Font Squirrel生成器似乎可以解决大多数人在@font-face问题上遇到的问题 - 但正如你在为什么其中一个font-face在IE8中呈现，而其他的不呈现？中所看到的那样，并非总是如此。

由于这不仅仅是兼容性问题 - 它根本无法在IE8中工作 - 看起来你唯一的选择就是在本地托管字体。

如果您想更好地控制字体并在字体加载或失败时操作CSS元素，请参见：如何知道字体（@font-face）是否已加载？

- Patrick

0

如果您的服务器是Apache，您可以在网站根目录下的.htaccess文件中用两行代码来替换这个指令：

BrowserMatch MSIE best-standards-support
Header set X-UA-Compatible IE=8 env=best-standards-support

有了这个，我在IE10或IE11下甚至模拟IE8时就不再遇到Google字体的问题了。

- zuiko

0

我已经验证，在IE8上（而不是在IE8文档模式下运行的其他IE版本）上面的HTML不起作用（即在我在Windows 8上的IE10中的示例中显示的方式）。因此，似乎IE10有一个更准确的IE8文档模式的修改版本。

- Paul Sweatte

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Bradley A. Tetreault · Accepted Answer

更新。

由于IE的性质，这似乎是一个比较复杂的问题。为了涵盖可能因特定情况而异而出现的问题，以下是参与者研究后得出的选项。

注意：确保清除可能存在的缓存，以确保页面正确加载/提供。

选项1：

将兼容性meta标记更改为<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />。

通过从IE = 8更改为EmulateIE8，您将导致兼容性模式尊重DOCTYPE，从而使IE正确地从CSS文件中加载字体首选项。

选项2：

检查您正在使用的文件格式是否以IE可以使用和理解的格式提供。

@font-face {
  font-family: 'Bitter';
  font-style: normal;
  font-weight: 400;
  src: url(https://themes.googleusercontent.com/static/fonts/bitter/v4/XexqN1a_o27MhVVdJFKAcA.eot);
  src: local('Bitter-Regular'), url(https://themes.googleusercontent.com/static/fonts/bitter/v4/XexqN1a_o27MhVVdJFKAcA.eot) format('embedded-opentype'), url(https://themes.googleusercontent.com/static/fonts/bitter/v4/SHIcXhdd5RknatSgOzyEkA.woff) format('woff');
}

需要注意的重要事项是字体文件的格式。就IE字体支持而言，情况有些像这样：

IE8仅支持.eot格式。
IE9/10支持.woff和.eot格式。

选项3：

如果你看到了这个选项，那么你可能正在处理IE对Web标准的采用和实现不佳的问题。可能发生的情况是IE9以IE8模式显示页面，但也添加了对.woff格式的自己支持。相反，IE10在IE8模式下正确地使用其实际支持的文件格式来显示页面。因此我的结论是，IE10实际上在正确地显示页面，而IE9试图掩盖糟糕的标准支持。

另一个想法是，既然你在评论中提到它现在似乎可以工作了，那么可能是Google错误地提供了错误的格式，因为浏览器是IE10，但它以IE8模式显示内容。如果是这种情况，那么IE8的“正确”显示意味着IE10可接受的.woff文件并不适用于IE8。

附注：

正是这种情况是所有Web开发人员最大的麻烦之一。IE竞争对手指出了非常糟糕的支持和不当的实现，但仍处于劣势，因为由于大多数人运行该特定操作系统，IE预装在市场上很大比例的PC上。这是非常有力的一个支持标准和最佳实践的论点。