看到的一篇好文章,分享给自己,主要是看起来比较轻松 很容易理解。
--------------------------------------------------------------------------
怪异模式和严格模式(译注:一般称为标准模式:Standards Mode,下文中的严格模式都可以理解为标准模式)是浏览器解析CSS时的两种‘模式’。这篇文章将简单阐述这两种模式之间的差异。
译注:一个网页一般由两部分组成即:HTML(Hypertext Markup Language)和CSS(Cascade Style Sheets)。
HTML负责描述网页的结构和内容(如标题,导航栏等),而CSS则负责网页的表现(外观)(如背景颜色,字体样式等)。
问题的产生:
当Netscape4(译注:网景公司早期的浏览器)和IE4(微软公司早期的浏览器)实现CSS机制时,并没有遵循W3C提出的标准。Netscape4 提供了糟糕的支持,而IE4 虽然接近标准,但依旧未能完全正确的支持标准。尽管IE 5 修复了IE4 许多的问题(bugs),但是依然延续CSS实现中的其它故障(主要是盒模型(box model)问题)。
为了保证自己的网站在不同的浏览器中都能正确展现,网页开发者不得不依据各个浏览器的自身的规范来使用CSS。因此大部分网站的CSS实现并未符合W3C的标准。
然而随着标准一致性变得越来越重要,浏览器开发商不得不面临一个艰难的抉择:逐渐遵循W3C的标准是前进的方向。但是改变现有CSS的实现,完整去遵循标准,会使许多网站或多或少受到破坏。如果浏览器突然以正确的方式解析现存的CSS,陈旧的网站显示必然受到影响。
因此立即遵循标准会产生问题,然而忽略标准则又会维持浏览器大战时(译注:微软和网景之间的一段竞争)所产生的混乱。
解决方案:
任何的解决方案必须跟随如下两个方面:
1:允许网站开发者能够选择他们所熟知的模式。
2:依然使用旧式规则显示陈旧的网站。
换句话说,所有的浏览器需要提供两种模式:怪异模式(即兼容模式)服务于旧式规则,严格模式服务于标准规则。Mac平台的IE浏览器最先实现这两种模式,Mozilla, Safari、Opera和Windows平台的IE6也相继实现了这两种模式。WIndows平台的IE5和Netscape4则只提供了怪异模式。
选择使用哪种模式需要一个触发器,而 “DOCTYP切换” 则用于此目的。依照标准,任何一个(X)HTML文档必须拥有一个DOCTYPE(译注:DTD(文档类型定义)是一组机器可读的规则,它们指示(X)HTML文档中允许有什么,不允许有什么,DOCTYPE正是用来告诉浏览器使用哪种DTD,一般放在(X)HTML文档开头声明)用以告诉其他人这个文档的类型风格
1:产生于标准化浪潮以前的网页并没有DOCTYPE声明。因此'没有DOCTYPE'意味着触发怪异模式:既依据旧式的CSS规则渲染网页。
2:相反,如果开发者明确知道包含DOCTYPE,他们应该明白他们想要怎么做。因此大部分的DOCTYPE声明将触发严格模式:即依据标准的CSS规则渲染网页。
3:任何新的或未知的DOCTYPE将触发严格模式。
4:一些页面依据怪异模式而写,但是却包含DOCTYPE。这种情况下各个浏览器依据自己的DOCTYPE规则列表来触发怪异模式,参照这个浏览器比较图表 。
注意:你的网页并不一定要依据所选择的DOCTYPE去获得有效性验证,一个DOCTYPE标签足以触发严格模式。
我在大部分网页中使用如下的DOCTYPE。它除了声明我的网页是XHTML 1.0 过渡类型之外,还将在所有浏览器中触发“准严格模式”(译注:下文将介绍这个模式)
完美的解决方案?
就个人而言,我并不十分满意“DOCTYPE切换”方案。一个DOCTYPE所提供的信息是(X)HTML文档所拥有的类型风格,即文档的结构,而不应该提供任何关于文档表现(外观)的信息,因为那违反了CSS关于页面结构和表现分离的原则。
并发症:准严格模式
在早些时候,尝试使用严格模式总是会产生关于图片会突然获得旧式的底部边距,并且无法移除的讨论。产生这个现象的原因是严格模式将标签当成行内元素,这意味着一些空间将被保留给一些拥有”尾部“的字符如(g, j, q),而图片并没有“尾部”字符,所以这些空间将不会被使用,但是却依旧保留着。
解决办法是声明图片为块级元素{display:block}
浏览器厂商,尤其是Mozilla,认为这是一种产生困惑的情况,于是他们引入了“准严格模式”(译注:也称为准标准模式 Almost Standards Mode),这与严格模式一样,除了它将图片当作块级元素而不是行内元素。
Windows平台IE的特殊性 : XML声明
在Windows平台的IE6 浏览器中,微软实现了一个额外的规则:如果DOCTYPE声明在XML声明之后,将触发怪异模式。这样做是为了允许开发者在怪异模式下获得“有效的网页” (需要DOCTYPE)。下面是XML声明,你需要将它放在页面的开头,在DOCTYPE之前。
注意这种行为已经从IE7 中移除。
译注:Peter-Paul Koch在这篇文章后面列出了怪异模式和严格模式在不同浏览器中的一些重要表现,建议了解一下。
相关推荐
SOP标准模式概论.pptxSOP标准模式概论.pptxSOP标准模式概论.pptxSOP标准模式概论.pptxSOP标准模式概论.pptx
总结而言,《设计模式》课程标准2018是一份为计算机科学与技术专业、软件工程专业学生设计的课程教学指南,它详细地阐述了教授GOF 23种设计模式的教学方法与要求,旨在通过理论与实践相结合的教学方式,提高学生对...
在51公里以下,USSA-1976与1962年的模式完全相同,而在50至80公里的高度,它与ISO的临时国际标准保持一致。USSA-1976被认为是表现大气平均状况的最佳模式。 至于我国的标准大气模式选用情况,由于长期以来中国没有...
采用STM32F429IGT6单片机,KeilMDK5.32版本 使用SysTick系统...在串口接收中断服务函数中,串口接收到数据则进入停止模式,外部中断触发则从停止模式下退出,从停止模式中唤醒需要重新配置时钟,调压器工作在正常模式
文档“参考资料-绿城代建模式及收费标准.doc”很可能包含了关于绿城集团在房地产行业中采用的代建模式以及与此相关的费用标准的详细信息。代建模式,全称为“项目代建”,是指一家公司(如绿城)受业主委托,负责房...
采用STM32F429IGT6单片机,KeilMDK5.32版本 使用SysTick系统滴答定时器进行延时 LED_R、LED_G、LED_B分别为PH10,PH11,PH12...在串口接收中断服务函数中,串口接收到数据则进入睡眠模式,外部中断触发则从睡眠模式下退出
对于刚毕业不久的同学们可能对工厂模式和三层结构还模糊不清,因为书本上只是侃侃而谈而实际例子有少之又少或者说简单之极。 我工作快2年了,可能自己太追求技术或者不注重构架,所以到最近才基本搞明白什么是工厂...
软件设计模式与软件标准体系结构实验报告 本实验报告旨在介绍软件设计模式和软件标准体系结构的概念,并通过实践实验对软件设计模式和软件标准体系结构的应用进行了探索和研究。实验报告涵盖了软件设计模式和软件...
《高校信息标准(数据模式)规范》是一份重要的文档,旨在为高等学府的信息系统建设提供统一的数据模式和设计准则,以确保数据的一致性、完整性和可互操作性。这份规范是高等教育信息化进程中的基石,它涵盖了教育管理...
Java软件体系结构设计模式标准指南 压缩文档包括(PDF + PPT + 课程源代码 + chm文档) 第一部分 设计模式简介 第二部分 URL 第三部分 基本模式 第四部分 创建模式 第五部分 集合模式 第六部分 结构模式 第七部分 ...
软件设计模式与标准体系结构 软件设计模式是软件设计中的一种思想和方法,它可以帮助软件开发者更好地设计和开发软件。软件设计模式可以分为几种,如创建型模式、结构型模式、行为型模式等每种模式都有其特点和应用...
《Java设计模式》课程标准2018详细知识点: 1. 课程概述 - 适用专业:计算机科学与技术专业、软件工程专业 - 先修课程:Java程序设计、软件工程 - 后续课程:JavaWeb程序设计、IT项目综合设计与实践 - 课程简介...
VESA分辨率标准定义了一系列通用的显示模式,这些模式包括不同的宽度、高度和颜色深度。例如,常见的VESA分辨率有640x480、800x600、1024x768、1280x1024等。这些分辨率不仅适用于传统的CRT显示器,也适用于LCD和LED...
Camera Link 标准定义了三种不同的配置方式,分别是基础模式(Base Configuration)、中级模式(Medium Configuration)和完整模式(Full Configuration)。 1. **基础模式(Base Configuration)** - 基础模式采用一对...
SOP标准模式说明使用
不过,我将尝试根据文件标题和描述,推断出与绿城代建模式及收费标准相关的知识点。 绿城代建模式: 绿城代建模式通常指的是绿城集团(一家知名房地产开发公司)为其他企业或项目提供的代建服务。代建模式是一种...