Heim  >  Artikel  >  Web-Frontend  >  Browser-Parsing-Modus: Detaillierte Erläuterung der Verwendung von DOCTYPE-Deklarationsproblemen

Browser-Parsing-Modus: Detaillierte Erläuterung der Verwendung von DOCTYPE-Deklarationsproblemen

伊谢尔伦
伊谢尔伦Original
2017-06-16 11:05:051551Durchsuche
网页制作cnn6文章简介:IE8有4种模式:IE5.5怪异模式、IE7标准模式、IE8几乎标准模式、IE8标准模式。

Trigger-Standardmodus

1. DOCTYPE-Anweisung hinzufügen, wie zum Beispiel:

< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
< !DOCTYPE html>

2.

Seltsamer Modus auslösen

1. Keine Doctype-Deklaration, alte HTML-Version definieren (unter HTML4, z. B. 3.2)
2. XML-Deklaration hinzufügen, kann unter ie6 ausgelöst werden
497f8d76472989c1c0f781fcd5255507
6696bd7d107ee1b4fe3f02d4fff4771a
3. Fügen Sie HTML zwischen der XML-Deklaration und dem DOCTYPE von XHTML hinzu Hinweis: Kann unter ie7497f8d76472989c1c0f781fcd5255507
826d2c99581c988c81c8ebb1fe6f2834
5. 1ce21ff05b6519698cd23502fbc95a8b Platz vor 2b4f2c0cce17b0f93b8a40188f240132 geschrieben wird, ist die Einstellung von X-UA-Compatible ungültig.
Hinweis 2: Wenn die Seite und der Server-HTTP-Header auf X-UA-kompatibel eingestellt sind, verwenden Sie die X-UA-kompatible Einstellung der Seite. Wenn die Seite nicht über X-UA-kompatibel verfügt, wird der im HTTP-Header festgelegte Wert verwendet.
Hinweis 3: Die Bedeutung und der Auslöser des Modus „Fast Standards“ werden unten im Abschnitt „Modus „Fast Standards““ erläutert.
Hinweis 4: Für den Wert von IE=xx wird versucht, xx in den nächstgelegenen Wert umzuwandeln. Beispiel: IE=7,789 -> IE=7; zwischen 5 und 6 ->IE=5; größer oder gleich 8;
Hinweis 5: IE=4, IE=3, IE=0,1, IE=-7, die kleiner als 5 sind, umfassen IE=IE8, IE=IE7, IE=IE6, IE=a, IE=b, IE =bcd, das gleiche wie ohne X-UA-Kompatibilität. Es kann verstanden werden, dass X-UA-Compatible auf einen ungültigen Wert eingestellt ist, also überspringen Sie hier.

2. X-UA-kompatiblen HTTP-Header festlegen


IE=5, IE=6: IE5-Ungewöhnlich-Modus auslösen (unabhängig davon, ob die Seite DOCTYPE hat oder nicht). )

IE=7(703476ae69e7db7856806fc2446528883=9) – mit Doctype - Verwenden Sie den Fast-Standard-Modus (oder IE9-Standards). Verlassen Sie sich wie bei IE8 auf den Doctype, um den IE9-Standardmodus oder den IE9-Standardmodus auszuwählen.
IE=(valueac0ff92a01f442bbf74dd5184df6790c geschrieben. Diese Situationen sind die gleichen wie ohne X-UA-Compatible: Bestimmen Sie zunächst die „Kompatibilitätsansicht“ und es gibt eine Einstellung für „Kompatibilitätsansicht“. Standard, kein DocType-Weird-Modus); „Kompatibilitätsansicht“ ist nicht eingestellt, es gibt DOCTYPE-Follow DocType, kein DocType-Weird-Modus.

Besondere Schreibweise X-UA-kompatibel

msdn上面提到了X-UA-Compatible值设置成"IE=9; IE=8; IE=5"这样的,意思就是优先最前面的IE9,没IE9就用IE8,没IE8就IE5,并且并不推荐在生产环境下使用。
触发Google Chrome Frame:3435c5972dd88b33da7181f5cc86ec33
可以和IE的X-UA-Compatible混搭:比如:edeeb43dc591905d5529bb5165ba0baa。这样写的好处:可以让ie在最好的渲染方式下渲染页面。
"IE=edge,chrome=1",可以写成"chrome=1,IE=edge"、"chrome=1; IE=edge"。

几乎标准模式(Almost Standards Mode)

Firefox 1+、Safari、Chrome、Opera(从7.5开始)和IE8/IE9增加了一个"几乎标准模式",它实现传统的表格单元格的垂直尺寸(没有严格的遵照CSS2规范)。
意思就是,比如下面的代码:

<table style="border:1px solid blue;" cellspacing="0">
< tr><td><img style="border:1px solid red" width="364" height="126" src="http://www.google.com/images/logos/ps_logo2.png"/></td></tr>
< /table>

比如在IE7标准模式下,图片底部和table是没空白的;"几乎标准模式"下,图片底部和table也是没空白的;而较新的浏览器在标准模式下图片底部和table会有个空白。
@see:https://developer.mozilla.org/en/Images,_Tables,_and_Mysterious_Gaps

下面的DOCTYPE都可触发IE8标准模式:


< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
< !DOCTYPE html>

触发IE8几乎标准模式:
c22098bfd3f62d7436149aaab013de1a
3c6ee2e4e556c3badc505155aae90f4f
Mac IE5、IE6/7、Opera(8f6e2fe385d7f17760ce5575dcfc3807)。
任何一个XHTML文档的解析错误会导致停止解析,FF/SF/CH/OP会直接报XML解析错误,IE9可以在开发人员工具的console里面看到报错。
MacIE5、IE6/7/8不支持application/xhtml+xml。
发现IE9下使用此模式,doctype是无所谓的,1d33348365c3ec55b420fe6254061305 这句命名空间必须的,没设置命名空间css会以文本解析而失效。
同时XML模式下,X-UA-Compatible的设置将会无效。

总结:

X-UA-Compatible只有IE>=8才识别,所以他们可以用doctype声明、X-UA-Compatible、兼容性视图设置来改变模式。
IE6/7却依靠DOCTYPE来改变标准或怪异模式,类似这些低版本的浏览器下的标准模式,接近与“先进”浏览器下的几乎标准模式,因为它们都没有严格遵循CSS2规范。并且他们同样在标准模式下,各自的渲染还是是有差别的。没差别就不会有css hack的诞生。
IE6-IE9下,怪异模式都在IE5.5下。
不需要写X-UA-Compatible,用css也完全可以搞定各个版本IE的解析不同。

模式、版本不同,不仅仅css解析不同,js的解析也有不同。
了解浏览器解析模式的不同,可以避免我们辛苦写出的标准代码被怪异所残害。
让开发者更注重遵循标准,无论在生产效率还是在协作、沟通上都有好处滴。
现在几乎人人都用标准的doctype来声明文档,所以纠结标准、怪异模式对工作的影响不太大。

Das obige ist der detaillierte Inhalt vonBrowser-Parsing-Modus: Detaillierte Erläuterung der Verwendung von DOCTYPE-Deklarationsproblemen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn