严格模式与混杂模式

之前作为前端小白的我,被面试官问到:严格模式与混杂模式的区别

不要怀疑,我肯定是一脸蒙蔽。

Doctype的作用:

简答:告诉浏览器,我要用啥规范解析文档。也就是告诉浏览器 ,该文件的类型。


严格模式:就是以W3C标准解析代码。(又称标准模式)

混杂模式:浏览器用自己的方式解析文档。(又称兼容模式)


如何区分:与网页中的DTD直接相关。

如何触发:

触发严格模式,就是正常的建立网页,声明正确的DTD,便是严格模式。

触发混杂模式可以通过在HTML文档开始不声明DTD,或者在DOCTYPE前加入XML声明l

version=”1.0〃 encoding=”utf-8〃?>来实现。


我觉得最重要的是:知道他们的差异

(1)盒模型不同

严格模式下,其高宽代表一个元素内容的高宽

混杂模式下,其高宽代表content+padding+border

(2)设置行内元素的高宽

严格模式下,不能给span等行内元素设置width和height

混杂模式下,可以设置

(3)设置百分比

严格模式下,一个元素的高度由其内容来决定。如果父元素没有设置高度,子元素设置百分比是无效的。

(4)水平居中

严格模式下:使用margin:0 auto

混杂模式下,用text-align

(5)混杂模式下,无法设置图片的padding,table字体不能继承上层设置,quirk模式下white-space:pre会失效

参考资料:

http://blog.csdn.net/binglingnew/article/details/17301433

http://www.cnblogs.com/wuqiutong/p/5986191.html

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

友情链接更多精彩内容