那麼,問題來了,什麼情況下頁面會處於混雜模式呢?下面是列出的幾種:
(1)不寫
(2)前面加上xml宣告 <?xml version="1.0" encoding="utf-8"?> (ie6)
(3)和<?xml version="1.0" encoding="utf-8"?>之間加了(標籤、文字、注釋)(ie8以下都有,ie9以上未測)
(4)前面有(標籤、文字、注釋)(ie8以下都有,ie9以上未測)
1和4是比較常見的,可能還有其他情況,還沒有遇到過具體的例子。。。我曾經在一篇文章看到說頁面結構錯誤也會引發混雜模式,不知道是怎麼個錯誤法。
混雜模型和嚴格模型的區別
1.盒模型的解析,混雜模式會按照ie5.5的盒模型解析。而標準模式是按標準的盒模型解析
2當乙個塊狀元素div/單元格包含的內容只有時,在標準模式下,不管是ie還是標準模式,在底部都有3畫素的空白,但是在混雜模式下
標準瀏覽器(chrom)中div距底部預設沒有空白
3.在混雜模式下,變格中的字型不會繼承它祖先元素(比如body 比如包含table的div)的字型樣式
<style
>
.wpstyle
>
<
body
>
<
div
class
="wp"
>
<
table
><
tr><
td>我是48號字
5.在ie的混雜模式下給inline元素設定高度和寬度都有效
<style
>
.inline
style
>
<
body
>
<
span
class
="inline"
>我是乙個span元素
6、在混雜模式下,ie和其他瀏覽器對百分比寬度的解析是不一樣的。如果父級是行內塊或者浮動或者有定位的元素,給子元素設定百分比寬度100%時,ie的混雜會以父級的100%算(父級沒有設定寬度,再往上一層),而標準瀏覽器是取決於內容的寬度
7、在混雜模式下,當我們給乙個元素設百分比高度,其他瀏覽器(正常,inline高度無變化,inline-block和block都會按百分比),而ie是自適應到內容高度。
8、overflow溢位預設值的問題。標準模式下,溢位元素是溢位可見的,超出部分的內容呈現在它的包含元素外。在混雜模式下,ie瀏覽器的溢位元素會自適應內容的尺寸。
標準模式與混雜模式
主要是盒模型的區別,導致各種各樣的與標準模式有差異的表現形式。當瀏覽器廠商開始建立與標準相容的瀏覽器時,他們希望確保向後相容性。為了實現這一點,他們建立了兩種呈現模式 標準模式和混雜模式。在標準模式下瀏覽器按照規範呈現頁面 在混雜模式下,頁面以一種比較寬鬆的向後相容的方式顯示。混雜模式通常模擬老式瀏...
標準模式與混雜模式
doctype 的乙個重要作用就是告訴瀏覽器,它該以何種模式呈現。我們通過document.compatmode這個屬性來檢測,當前頁面處於何種模式 css1compat 標準模式 backcompat 混雜模式 那麼,問題來了,什麼情況下頁面會處於混雜模式呢?下面是列出的幾種 1 不寫 2 前面加...
標準模式與混雜模式
1,當瀏覽器廠商開始建立與標準相容的瀏覽器時,他們希望確保向後相容性。為了實現這一點,他們建立了兩種呈現模式 標準模式和混雜模式。在標準模式下瀏覽器按照規範呈現頁面 在混雜模式下,頁面以一種比較寬鬆的向後相容的方式顯示。混雜模式通常模擬老式瀏覽器的行為以防止老站點無法工作。2,區分 瀏覽器根據doc...