Internet Explorer 的条件文档类型答案

【问题标题】：Conditional Doc Type for Internet ExplorerInternet Explorer 的条件文档类型
【发布时间】：2014-03-20 20:30:20
【问题描述】：

我的应用程序在 IE 8 和 IE 11 上运行时遇到问题，因为我的客户很少使用 IE8，也很少有人使用 IE 11。由于 doctype 标签，我遇到了一些与布局相关的问题。

当我在我的母版页中添加此 doctype 标记时，我的布局在 IE 8 中变形，但在 IE 11 中可以正常工作

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

同样地，当我删除这个标签时，它在 IE 8 中可以正常工作，但在 IE 11 中则不行。

【问题讨论】：

【解决方案1】：

首先，检查浏览器用于显示页面的模式。从 IE8 开始的所有 IE 版本都带有一个开发工具窗口，可以通过按 F12 打开。这将向您显示浏览器正在使用的模式。如果它不是“IE8 标准”（针对 IE8）或“Edge”（针对 IE11），那么您需要问自己为什么。

了解浏览器处于何种模式将有助于您解决问题。

关于文档类型，这里只有一条规则：总是总是包含一个文档类型。您不应该在当今的网络上编写根本没有 doctype 的 HTML 页面。

如果您没有 doctype，那么 IE（所有版本，以及其他浏览器）会将页面置于“Quirks 模式”。这将导致您的页面布局出现问题，并导致它在不同浏览器中的工作方式不同（甚至在同一浏览器的不同版本中）。应尽可能避免 Quirks 模式，因此您应该始终拥有 doctype。

如果您可以选择使用哪种文档类型，请考虑使用 HTML5 文档类型：<!DOCTYPE html>。

理论上，您使用的几乎所有（有效的）文档类型都应该具有相同的工作方式：即将页面置于标准模式。您使用的文档类型是 XHTML 过渡文档类型。这应该没问题，但同样，HTML5 doctype 也应该可以正常工作，并且更简单的 doctype 字符串降低了拼写错误导致其无效并破坏页面的可能性。

文档类型必须是页面上的第一件事。在它之前没有 cmets 或空白。这可能会导致某些版本的 IE 将文档类型视为无效。

使用有效的文档类型，您应该不再将 Quirks 模式显示为开发工具中的模式。

接下来要做的是通过W3C Validator 运行您的HTML 代码。这将返回您的代码中可能存在的任何 HTML 语法错误的详细信息。此处显示的错误通常是导致跨浏览器异常的类型，因此您应该修复验证器中报告的任何内容。

如果 IE 的浏览器模式显示为兼容模式，有多种原因会导致这种情况发生，但您通常可以通过确保您的 HTML <head> 包含以下行来解决这个问题：

<meta http-equiv="X-UA-Compatible" content="IE=edge">

“edge”设置告诉所有版本的 IE 使用其最佳可用渲染模式。除非您有非常具体的理由使用特定的兼容模式，否则您永远不需要为此标志使用任何其他值。

为了进一步阅读，我 written a detailed article 解释了如何将 IE 保持在标准模式以及为什么这是一件好事。

我希望这会有所帮助。

【讨论】：

【解决方案2】：

尝试将 X-UA-Compatible 元标记放在 <head> 上。它将使 IE 使用最新的布局引擎渲染 html。

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

【讨论】：