1. 程式人生 > >混雜模式與標準模式總結

混雜模式與標準模式總結

mod 默認 內容 也會 XML 使用 聲明 doc 參考

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

混雜模式與標準模式總結