标准模式与怪异模式:
由于历史的原因,各个浏览器在对页面的渲染上存在差异,甚至同一浏览器在不同版本中,对页面的渲染也不同。在W3C标准出台以前,浏览器在对页面的渲染上没有统一规范,产生了差异(Quirks mode或者称为Compatibility Mode);由于W3C标准的推出,浏览器渲染页面有了统一的标准(CSScompat或称为Strict mode也有叫做Standars mode),这就是二者最简单的区别。
W3C标准推出以后,浏览器都开始采纳新标准,但存在一个问题就是如何保证旧的网页还能继续浏览,在标准出来以前,很多页面都是根据旧的渲染方法编写的, 如果用的标准来渲染,将导致页面显示异常。为保持浏览器渲染的兼容性,使以前的页面能够正常浏览,浏览器都保留了旧的渲染方法(如:微软的IE)。这样浏览器渲染上就产生了Quircks mode和Standars mode,两种渲染方法共存在一个浏览器上。
火狐一直工作在标准模式下,但IE(6,7,8)标准模式与怪异模式差别很大,主要体现在对盒子模型的解释上,这个很重要,下面就重点说这个。
那么浏览器究竟该采用哪种模式渲染呢?这就引出的DTD,既是网页的头部声明,浏览器会通过识别DTD而采用相对应的渲染模式:
1. 浏览器要使老旧的网页正常工作,但这部分网页是没有doctype声明的,所以浏览器对没有doctype声明的网页采用quirks mode解析。
2. 对于拥有doctype声明的网页,什么浏览器采用何种模式解析,这里有一张详细列表可参考:http://hsivonen.iki.fi/doctype/
3. 对于拥有doctype声明的网页,这里有几条简单的规则可用于判断:对于那些浏览器不能识别的doctype声明,浏览器采用strict mode解析
4. 在doctype声明中,没有使用DTD声明或者使用HTML4以下(不包括HTML4)的DTD声明时,基本所有的浏览器都是使用quirks mode呈现,其他的则使用strict mode解析。
5. 可以这么说,在现有有doctype声明的网页,绝大多数是采用strict mode进行解析的。
6. 在ie6中,如果在doctype声明前有一个xml声明(比如:<?xml version="1.0" encoding="iso-8859-1"?>),则采用quirks mode解析。这条规则在ie7中已经移除了。
如何设置为怪异模式:
方法一:在页面项部加 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
我们用Eclipse的HTML模板新建的html页面,自动就有上面东东
方法二:什么也不加。
如何设置为标准模式:
加入以下任意一种:
HTML4提供了三种DOCTYPE可选择:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
XHTML1.0提供了三种DOCTYPE可选择:
(1)过渡型(Transitional )
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
(2)严格型(Strict )
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
(3)框架型(Frameset )
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
这里有一张详细列表可参考:http://hsivonen.iki.fi/doctype/
如何判定现在是标准模式还是怪异模式:
方法一:执行以下代码
alert(window.top.document.compatMode) ;
//BackCompat 表示怪异模式
//CSS1Compat 表示标准模式
方法二:jquery为我们提供的方法,如下:
alert($.boxModel)
alert($.support.boxModel)
IE6,7,8浏览器的标准模式还是怪异模式 盒子模型的 差异
详细说明:http://hsivonen.iki.fi/doctype/
- 浏览: 48423 次
相关推荐
例如,在IE8中,默认文档模式为IE8标准模式。 - **条件注释**: 不同版本的浏览器支持不同的条件注释语法。浏览器模式的变化会影响到这些条件注释的解析方式。 - **用户代理字符串**: 浏览器模式还会影响发送给服务器...
例如,怪异模式(quirks mode)和标准模式(standard mode)就是根据文档类型而定的。 X-UA-Compatible meta 标签和头部是 HTML 文档中的 meta 标签和 HTTP 响应头,它们可以指定浏览器使用哪种渲染模式来渲染网页...
6. **文档模式**:IE8有几种文档模式(如quirks模式、怪异模式、标准模式),理解它们之间的切换规则和影响,可以帮助调试和修复问题。 7. **条件注释**:IE浏览器特有的条件注释可以帮助开发者针对IE8编写特定的...
在IE8及更早版本的IE浏览器中,存在着多种渲染模式,包括Quirks Mode(怪异模式)、Almost Standards Mode(接近标准模式)以及Standards Mode(标准模式)。其中,IE8引入了一个新的特性——Document Mode,即文档...
- **浏览器模式与文档类型声明**:不同的文档类型声明会影响浏览器的渲染模式,标准模式下,推荐使用过渡型(transitional)标准。 4. **CSS优先级与继承**: - **优先级**:ID选择器 > 类选择器 > 标签选择器 > ...
标准模式遵循Web标准,而怪异模式则遵循旧版本浏览器的渲染规则。 HTML的标签上的title和alt属性分别有不同用途。alt属性用于在图片无法显示时提供替代文本,而title属性则提供了额外的信息提示,通常在鼠标悬停时...
DOCTYPE html>`,以确保浏览器使用标准模式。 8. **文档模式(Document Mode)**:IE6至IE11有多种文档模式,它们对CSS的支持程度不同。开发者可以通过`X-UA-Compatible`响应头或HTML注释来指定期望的文档模式。 9...
3. **IE8的渲染模式选择**:IE8支持两种渲染模式,即标准模式和怪异模式,可以通过元标签来控制其采用哪种模式。 #### 二、解决div错位的方法 - **调整`margin`值**:为了修复IE6中div错位的问题,可以尝试调整div...
DOCTYPE>`来确保IE6进入标准模式渲染,避免怪异模式。 **双语切换的实现策略:** 1. **国际化资源文件**:创建不同语言的.properties文件,如message_en.properties(英文)和message_zh_CN.properties(简体中文)...
5. **文档模式与兼容视图**:IE提供了多种文档模式,如Quirks模式、IE7模式等。开发者需要了解如何通过`X-UA-Compatible`响应头或`<meta>`标签来控制IE的渲染模式。 6. **渐进增强和优雅降级**:在设计和编码时,应...
### IE盒子模型与标准W3C盒子模型详解 #### 一、引言 在Web前端开发领域,理解和掌握CSS(层叠样式表...通过本文的介绍,相信您已经对IE盒子模型与标准W3C盒子模型有了更深入的理解,这对于提高Web开发技能至关重要。
### Web前端面试题知识点解析 ... **1....这些浏览器的内核分别是什么?** - **浏览器**: 测试过的浏览器通常包括Chrome、Firefox、Safari、Edge...- 标准模式遵循 W3C 规范,怪异模式则模拟老式浏览器的行为。 **54. CSS...
- IE使用怪异模式(Quirks Mode),盒模型的边框计算方式与标准模式(Standards Mode,如FF)不同,可能导致布局问题。确保HTML文档声明正确,使用标准模式。 解决这些兼容性问题通常需要使用条件注释、特性检测或...
14. **标准模式与怪异模式**:标准模式遵循W3C规范,渲染准确;怪异模式遵循早期浏览器的非标准行为,可能导致布局问题。可以通过`document.compatMode`检查当前模式。 15. **网站资源优化**:文件合并减少HTTP请求...
- 怪异模式(Quirks mode)和标准模式(Standards mode)的区别:在标准模式下,浏览器会按照规范来解析HTML和CSS;而怪异模式下,浏览器会采取一种非标准的解析方式,可能导致兼容性问题。 - CSS布局优化:与传统...
例如,对于IE来说,正确的DOCTYPE声明可以帮助避免进入怪异模式。正确的DOCTYPE声明如下: ```html <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> ``` ...
13. **标准模式与怪异模式** 标准模式遵循W3C标准,怪异模式遵循早期浏览器的非标准解析方式。可以通过`document.compatMode`检查当前模式。 14. **资源优化策略** 包括文件合并减少HTTP请求,文件最小化/压缩...
3. **盒模型问题**:IE7遵循自己的“怪异模式”(Quirks Mode)盒模型,与W3C标准不符,可能导致宽度和高度计算错误。 4. **CSS选择器不完全支持**:IE7不支持一些高级CSS选择器,如`:hover`在非链接元素上的应用、`...