DOCTYPE宣告作用
網頁中用了 <!DOCTYPE html... 就表示該頁面採用了W3C標準,這樣做可以增強頁面的相容性,降低對瀏覽器的依賴性。
不加這一行,就表示頁面採用瀏覽器本身的解析標準,這樣會造成頁面在不同的瀏覽器(IE、火狐等)可能出現不同的顯示效果。
例子:
不新增docType宣告下,IE下的table標籤的樣式:
新增docType宣告下 ,table標籤的樣式:
經過計算後,樣式為:
瀏覽器呈現模式
現代瀏覽器包括不同的呈現模式,目的是既支援遵循標準的網頁,也支援為老式瀏覽器而設計的網頁。其中, Standards (標準)模式(也就是嚴格呈現模式)用於呈現遵循最新標準的網頁,而 Quirks (包容)模式(也就是鬆散呈現模式或者相容模式)用於呈現為傳統瀏覽器而設計的網頁。另外,注意Mozilla/Netscape 6新增了一種 Almost Standards (近似標準)模式,用於支援為標準的某個老版本而設計的網頁。
什麼是 doctype切換?
放在網頁頂部的doctype宣告是讓瀏覽器進入正確呈現模式的關鍵。瀏覽器自動切換到恰當的呈現模式,以便正確顯示由doctype宣告所指定的文件種類。
理論上,這應該是一個非常直觀的切換。假如doctype指出當前網頁是一個遵循標準(也就是HTML 4+或XHTML 1+)的文件,瀏覽器就會切換到Standards模式。假如沒有指定doctype,或者指定HTML 3.2以及更老的版本,瀏覽器就切換到Quirks模式。這樣一來,瀏覽器既能正確顯示遵循標準的文件,又不至於完全捨棄老式的、與標準不符的網頁。
相關文章
- DOCTYPE(文件型別)作用型別
- HTML <!DOCTYPE>HTML
- !DOCTYPE —— HTML文件模式HTML模式
- JavaScript塊級作用域宣告函式JavaScript函式
- Solidity語言學習筆記————25、作用域和宣告Solid筆記
- 面試— !Doctype的作用,嚴格模式和混雜模式的區別、以及如何觸發兩種模式面試模式
- Doctype的作用?嚴格模式與混合模式,如何觸發者這兩種模式,區分它們有何意義?模式
- JavaScript 之有趣的函式(函式宣告、呼叫、預解析、作用域)JavaScript函式
- 從【預編譯】到【宣告提升】到【作用域鏈】再到【閉包】編譯
- golang 快速入門 [8.1]-變數型別、宣告賦值、作用域宣告週期與變數記憶體分配Golang變數型別賦值記憶體
- 全域性作用域中,用const和let宣告的變數去哪了?變數
- js中宣告提升、作用域(鏈)、`this`關鍵字和箭頭函式JS函式
- JS變數宣告和函式宣告提升JS變數函式
- 《前端實戰總結》之變數提升,函式宣告提升及變數作用域詳解前端變數函式
- 文件修改宣告
- PL/SQL 宣告SQL
- springboot宣告事物Spring Boot
- 淺談JS變數宣告和函式宣告提升JS變數函式
- 深入解析JS變數宣告和函式宣告提升JS變數函式
- JavaScript 宣告變數JavaScript變數
- JavaScript之宣告提升JavaScript
- 06函式宣告函式
- 5.7 屬性宣告
- TypeScript 變數宣告TypeScript變數
- ArrayList宣告,Add(), Insert();
- 反詐騙宣告
- API的宣告性力量API
- SCSS 變數的宣告CSS變數
- 使用 React Hooks 宣告 setIntervalReactHook
- 轉向vscode的宣告VSCode
- SpringBoot3.2更新宣告!Spring Boot
- 失業日記 宣告
- 用預編譯去理解函式宣告提升和變數宣告提升編譯函式變數
- TypeScript系列?尾聲篇, 什麼是宣告檔案(declare)? [?全域性宣告篇]TypeScript
- CSS 屬性宣告順序CSS
- 宣告變數的問題變數
- Rust 的宣告宏機制Rust
- Mysql變數宣告的方式MySql變數
- 三 Spring 宣告式事務Spring