|
文本模式
說起“文本模式”這個(gè)名詞，這又要回到渲染頁面的3種模式了：詭異模式（Quirks mode，也有翻譯為兼容模式、怪異模式的），標(biāo)準(zhǔn)模式（Standards mode），和幾乎標(biāo)準(zhǔn)模式（Almost standards mode）。這是一個(gè)非常重要、但是很多人卻比較模糊的概念。一兩句話不太能說清楚，這樣說吧——“頁面的不同渲染模式，將直接影響頁面的最終呈現(xiàn)效果”，也就是說，一個(gè)頁面如果在這種模式下顯示完美，但是在另外一種模式下可能就顯示的一塌糊涂。而決定頁面模式的是頁面的!DOCTYPE屬性。
乖乖，這玩意太繞人了，還是直接上例子吧。最經(jīng)典的就是對(duì)盒裝模型的解釋差異了。下面兩個(gè)圖，是相同頁面，采用不同頁面渲染模式的最終顯示效果。
頁面很簡(jiǎn)單，只要一個(gè)div元素，然后隨便設(shè)置一點(diǎn)高度、寬度、padding、margin就可以了。核心代碼如下：
<style type="text/css">
#divTest{
background-color:red;
padding:10px;
margin:10px;
width:100px;
height:100px;}
</style>
<div id="divTest">
<!--[if IE 7]>
瀏覽器是IE7
<![endif]-->
<!--[if IE 8]>
瀏覽器是IE8
<![endif]-->
</div>
從圖片中，我們可以清楚的看到，紅色div塊的大小和位置，在不同的文本模式下，發(fā)生了明顯的變化。
關(guān)于文本模式的詳細(xì)資料，我建議你看這篇文章《Quirks mode、Almost standards mode、Standards mode》。雖然是英文原版的資料，也絕對(duì)值得翻著字典看完。還有這篇視頻教程中，我也有較為詳細(xì)的介紹到，《“阿一web標(biāo)準(zhǔn)學(xué)堂”第4課》
出處：藍(lán)色理想
責(zé)任編輯：bluehearts
上一頁 IE8"開發(fā)人員工具"使用詳解 [1] 下一頁 IE8"開發(fā)人員工具"使用詳解 [3]
◎進(jìn)入論壇網(wǎng)頁制作、WEB標(biāo)準(zhǔn)化版塊參加討論，我還想發(fā)表評(píng)論。
|
第 1 頁 
第 2 頁 IE8"開發(fā)人員工具"使用詳解 [2]
