瀏覽器標準模型和怪異模型的區別

2021-08-22 15:10:30 字數 829 閱讀 8678

從ie6開始,引入了standards模式,標準模式中,瀏覽器嘗試給符合標準的文件在規範上的正確處理達到在指定瀏覽器中的程度。

在ie6之前css還不夠成熟,所以ie5等之前的瀏覽器對css的支援很差, ie6將對css提供更好的支援,然而這時的問題就來了,因為有很多頁面是基於舊的布局方式寫的,而如果ie6 支援css則將令這些頁面顯示不正常,如何在即保證不破壞現有頁面,又提供新的渲染機制呢?

在寫程式時我們也會經常遇到這樣的問題,如何保證原來的介面不變,又提供更強大的功能,尤其是新功能不相容舊功能時。遇到這種問題時的乙個常見做法是增加引數和分支,即當某個引數為真時,我們就使用新功能,而如果這個引數 不為真時,就使用舊功能,這樣就能不破壞原有的程式,又提供新功能。ie6也是類似這樣做的,它將dtd(文件型別定義)當成了這個「引數」,因為以前的頁面大家都不會去寫dtd,所以ie6就假定

dtd是為英文*document type definition,中文意思為「文件類定義」。

如果寫了dtd,就意味著這個頁面將採用對css支援更好的布局,而如果沒有,則採用相容之前的布局方式。這就是quirks模式(怪癖模式,詭異模式,怪異模式)

在嚴格模式中 :給元素設定的 寬度 = content;在怪癖模式中 :給元素設定的 寬度 = content+padding+border

可以設定行內元素的高寬

可設定百分比的高度

用margin:0 auto設定水平居中在ie下會失效

quirk模式下設定的padding會失效

quirk模式下table中的字型屬性不能繼承上層的設定

quirk模式下white-space:pre會失效

瀏覽器標準模式和怪異模式的區別

兩者的區別 1.盒模式的解析上 在strict mode 中 width是內容寬度 在quirks mode 中 width則是元素的實際寬度,而內容寬度 width margin left margin right padding left padding right border left bo...

瀏覽器標準模式和怪異模式的區別

瀏覽器解析css的兩種模式 標準模式 strict mode 和怪異模式 quirks mode 標準模式 瀏覽器按w3c標準解析執行 怪異模式 使用瀏覽器自己的方式解析執行 因為不同瀏覽器解析執行的方式不一樣,所以稱之為怪異模式。瀏覽器解析時使用標準模式還是怪異模式,與網頁中的dtd宣告直接相關,...

聊聊標準盒模型和怪異盒模型的區別

作為前端工作者,想必對於盒模型這個概念應該並不陌生,我們在平日的工作中無時無刻不在使用它,但是作為剛剛踏入這個行業的小白來講,對於標準盒模型和怪異盒模型的理解或許還是傻傻分不清,這裡小編我就來跟大家聊一聊關於我理解中的盒模型的那些事兒 希望對剛剛踏入這個行業的小夥伴們有所幫助!廢話不多說,我們走起 ...