logo标签列表

IE兼容模式Bug

internet-explorerhtmlie8-compatibility-mode
7

这是我页面顶部的代码：

<!DOCTYPE html>

<!--[if lt IE 7 ]> <html lang="en" class="no-js ie6"> <![endif]-->
<!--[if IE 7 ]>    <html lang="en" class="no-js ie7"> <![endif]-->
<!--[if IE 8 ]>    <html lang="en" class="no-js ie8"> <![endif]-->
<!--[if IE 9 ]>    <html lang="en" class="no-js ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html lang="en" class="no-js"> <!--<![endif]-->
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
    <meta charset="utf-8">
    <title></title>
    ...

我正在使用Paul Irish的条件注释代码来更轻松地检测和解决IE问题，但是这段代码似乎本身就会引起问题。问题在于，使用条件注释代码会强制将我的页面转换为IE8兼容模式，尽管我根据MSDN指南明确声明了ie=edge。
删除html标签周围的条件注释代码可以修复该问题并使IE8以标准模式呈现；但是我更想找到一个解决方案，让我保留条件代码并仍然强制IE以标准兼容模式呈现。请记住，由于该站点使用的是Windows / ASP设置，因此我没有.htaccess文件可用。
5个回答
7
在开头添加一个空注释即可解决问题。
<!--[if IE_NEEDS_THIS]><![endif]-->
<!DOCTYPE HTML>
<!--[if lt IE 9]><html class="lt-ie9"><![endif]-->
<!--[if gt IE 8]><!--><html class="gt-ie8"><!--<![endif]-->
<head>
<meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<title>--</title>

但不要在meta标签周围加条件注释。否则，IE10会陷入怪异模式。
2

我发现如果在文档开头有注释，那么元标记也可以被放在注释中。

无论如何，它都能起作用并且是有效的HTML5！

<!–[if IE]><![endif]–>
 <!DOCTYPE html>
 <html lang="de">
 <head>

<title></title>
 <!–[if gte IE 8]><meta http-equiv="X-UA-Compatible" content="IE=Edge" /><![endif]–>

在这种情况下，仅支持IE8和IE9，但不支持content="IE=Edge,Chrome"。因此，请仅使用content="IE-Edge"。
我喜欢将元数据放在仅限IE的条件注释中，因为元数据只针对IE。 - nebulousGirl
这里有一篇文章 http://nicolasgallagher.com/better-conditional-classnames-for-hack-free-css/ 但是... 我有点担心，未来的ie版本或者其他浏览器如果在doctype之前加入任何内容可能会出现问题。 - user1010892
0

你说：

请记住，我没有 .htaccess 文件可用，因为该网站使用的是 Windows/ASP 设置。

我猜这意味着你可以通过将 X-UA-Compatible 指定为 HTTP 响应头来解决问题，而不是作为元标记。

如果你正在使用经典 ASP，你可以在文件顶部使用以下代码，并摆脱元标记：
（根据你的个人资料中缺少 ASP.NET 相关内容，我猜你指的是经典 ASP）

Response.AddHeader "X-UA-Compatible", "IE=edge,chrome=1"

我认为这个答案猜测过多，可能根本行不通。

此外，也许这个问题可以帮到您：

IE8标准模式meta标签

0
你应该尝试包含链接内容的要点，这样你就不会像最佳答案那样了... - StephenTG
0
但似乎他仍然可以尝试将其放在<body>标签上？不确定是否受到相同错误的影响。 - Ben Regenspan
2
这可能是更新的链接：https://github.com/h5bp/html5-boilerplate/issues/1187，可能与以下问题相关：https://github.com/h5bp/html5-boilerplate/issues/378。 - Erik Noren
代码库更改了网址；这是新的链接 https://github.com/h5bp/html5-boilerplate/issues/1187 - albert
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接