混杂模式与标准模式总结
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了混杂模式与标准模式总结相关的知识，希望对你有一定的参考价值。
1 区分模式的意义？
IE5.5引入了文档模式的概念，通过使用DOCTYPE实现模式切换，它的主要作用是告诉浏览器以哪种模式呈现，如何解析文档，也就是说两种模式主要影响CSS内容的呈现，某些情况下也会影响javascript的执行。
2什么是混杂模式、什么是标准模式
混杂模式是一种向后兼容的解析方式，是实现IE5.5以下版本浏览器的渲染模式。
标准模式是一种要求严格的DTD，根据web标准去解析页面的模式。
3两种模式的区别
- 盒模型的解析：混合模式盒模型的宽高=内容的宽高；标准模式盒模型的宽高=内容的宽高+padding的宽高+border的宽高。
- 当一个块元素div中包含的内容只有图片时，在标准模式下，不管IE还是标准，在图片底部都有3像素的空白。但在混杂模式下，标准浏览器（Chrome）中div距图片底部默认没有空白。
4如何判断两种模式
if(document.compatMode=="CSS1Compat" ) {
console.log(‘标准模式‘);
}else {
console.log(‘混杂模式‘);
}
5两种模式怎样触发
触发混杂模式
（1）不写<!DOCTYPE html>
（2）<!DOCTYPE html>前面加上xml声明 <?xml version="1.0" encoding="utf-8"?> (IE6)
（3）<!DOCTYPE html>和<?xml version="1.0" encoding="utf-8"?>之间加了（标签、文本、注释）(ie8以下都有，ie9以上未测)
（4）<!DOCTYPE html>前面有（标签、文本、注释）(ie8以下都有，ie9以上未测)
触发标准模式
正常的建立html即可
参考:http://www.cnblogs.com/qianlegeqian/p/4067635.html
以上是关于混杂模式与标准模式总结的主要内容，如果未能解决你的问题，请参考以下文章
如何理解DocType? 什么是严格模式与混杂模式？如何触发这两种模式?
Doctype作用？严格模式与混杂模式如何区分？它们有何意义