IE盒模型和標准盒模型


標准盒模型和ie盒模型(怪異盒模型)

  1. w3c標准盒模型

    • width和height不包括padding和border
  2. ie盒模型

    • width和height包含padding和border
  • ie8以上都是w3c標准盒模型    ie5極其以下都是ie盒子模型,ie6、ie7、ie8在混雜模式下ie盒模型,在標准模式下是w3c標准盒模型
    (注意:ie6在混雜模式下一定是Ie盒模型,而ie7、ie8在混雜模式下不一定是ie盒模型)
  • css3中的box-sizing

    • content-box w3c標准盒模型

    • boder-box IE盒模型 / 怪異盒模型

混雜模式和標准模式

在多年以前(IE6誕生以前),各瀏覽器都處於各自比較封閉的發展中(基本沒有兼容性可談)。隨着WEB的發展,兼容性問題的解決越來

越顯得迫切,隨即,各瀏覽器廠商發布了按照標准模式(遵循各廠商制定的統一標准)工作的瀏覽器,比如IE6就是其中之一。但是考慮到以

前建設的網站並不支持標准模式,所以各瀏覽器在加入標准模式的同時也保留了混雜模式(即以前那種未按照統一標准工作的模式,也叫怪

異模式)。經過多年的發展,后來又出現了近似標准模式(在一種模式中同時融入標准模式和部分混雜模式的特性,也稱為接近標准模式、

准標准模式、最有限混雜模式)和超級標准模式近似標准模式、標准模式、超級標准模式三者也共同被稱作標准模式)。因此,瀏覽器的

模式可以分為兩類:標准模式和混雜模式,其中,標准模式又可更嚴格的分為近似標准模式、標准模式、超級標准模式。

  1. 混雜模式會讓IE的行為與(包含非標准特性的)IE5相同
    而標准模式會讓IE的行為貼近W3C標准
 1.<!DOCTYPE html>
 2.<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
 3.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  1. 標准模式可以通過doctype 和 嚴格型(strict)聲明來開啟。
    而混雜模式可以通過過渡性(transitional)和框架集型(frameset)聲明來開啟

IE注釋判斷語句

IE特有功能,通過HTML注釋中的條件語句然不同的IE版本識別注釋中的內容,這對IE的hacks很有幫助。

1)<!--[if lt IE 7]> : 小於 IE7 的版本 ( Less than );

2)<!--[if lte IE 7]> : 小於或等於 IE7 的版本 ( Less than or equal );

3)<!--[if gt IE 7]> : 大於 IE7 的版本 ( Greater than );

4)<!--[if gte IE 7]> : 大於或等於 IE7 的版本 ( Greater than or equal );

5)<!--[if !IE 7]> : 不等於 IE7 的版本 ( Not );

6)<!--[if !IE]> :不等於 IE 的版本 ( equal );

   <!--[if IE 6]>
    Only recognized in IE7;
    只能被IE7識別
    此處可以填樣式
    <![endif]>

 

--------------------------------------end


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM