《HTML5+CSS3網頁設計入門必讀》——2.4 DOCTYPE:形式更簡潔
本節書摘來自非同步社群《HTML5+CSS3網頁設計入門必讀》一書中的第2章,第2.4節,作者: 【英】Jeremy Keith , 【美】Dan Cederholm 更多章節內容可以訪問雲棲社群“非同步社群”公眾號檢視。
2.4 DOCTYPE:形式更簡潔
文件型別宣告(Document Type Declaration)簡稱為doctype,一直用於指定文件所編寫的標記型別。
HTML 4.01的 doctype如下所示(»為自動換行標記):
<!DOCTYPE HTML PUBLIC »
"-//W3C//DTD HTML 4.01//EN" »
"http://www.w3.org/TR/html4/strict.dtd">
XHTML 1.0 的doctype如下所示:
<!DOCTYPE html PUBLIC »
"-//W3C//DTD XHTML 1.0 Strict //EN" »
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
這些doctype看起來並不易讀,但它們以其獨特的方式簡單地說明了:“該文件用HTML 4.01編寫”或“該文件用XHTML 1.0編寫”。
如果doctype聲稱“該文件用HTML5編寫”,那麼按道理其中應該會出現數字5。但事實並非如此。HTML5的doctype如下所示:
<!DOCTYPE html>
該doctype是如此之短,甚至可以讓人將其背誦下來。
這實在是太不可思議了!如果 doctype中不含有版本號,那麼該如何指定其他版本的HTML呢?
第一次看到HTML5的doctype的時候,我認為這是高度傲慢的結果。心想:“難道他們真相信這就是標記規範的最終版了嗎?”
然而事實上,HTML5的doctype是非常務實的。由於HTML5需要支援現有內容,所以其doctype可以應用於現有的HTML 4.01文件和XHTML 1.0文件。任何未來版本的HTML也需要支援HTML5中的現有內容,因此應用版本號來標記文件的觀念是有缺陷的。
事實上,doctype並不那麼重要。假設需要為一個文件提供HTML 4.01的doctype。如果該文件中包含來自另一個規範的元素,如HTML 3.2或HTML5,那麼瀏覽器將仍然呈現該文件的這一部分。這是因為瀏覽器支援的是特性,而非doctype。
起初,文件型別宣告(Document Type Declaration)是為驗證器而非為瀏覽器而設計的。瀏覽器僅在“doctype轉換”的情況下才會關注doctype——“doctype轉換”(doctypy switching)是一個聰明的小黑客,它根據是否存在合適的doctype來轉換顯示模式,即怪異模式(quirks mode)或標準模式(standard mode)。
為了確保瀏覽器以標準模式顯示,至少需要HTML5的doctype。事實上,這是包含doctype的唯一原因。不用HTML5的doctype編寫的HTML文件仍然是有效的HTML5。
相關文章
- paradis:更簡潔的新Rust並行程式設計庫Rust並行行程程式設計
- 淺談零信任網路,入門必讀!
- Python+django網頁設計入門(15):公用模板設計與使用PythonDjango網頁
- Python+django網頁設計入門(16):優化設計複用分頁程式碼PythonDjango網頁優化
- 極簡 Node.js 入門 - 2.4 定時器Node.js定時器
- 網頁設計入門應該學什麼?網站設計八步驟分享網頁網站
- 一文帶你響應式網頁設計入門網頁
- 從萌新到大神必讀書籍 《Python快樂程式設計基礎入門》Python程式設計
- 使用 Macro 讓你的程式碼更簡潔,更具有可讀性Mac
- 程式設計和網路程式設計入門程式設計
- 極簡網頁設計技巧,打造簡約之美網頁
- 按照python程式設計入門到實踐 18章節建立網頁開啟網頁失敗Python程式設計網頁
- Python+django網頁設計入門(17):模板語法及應用PythonDjango網頁
- Python+django網頁設計入門(18):自定義模板過濾器PythonDjango網頁過濾器
- 如何讓我們的模型更簡潔模型
- 讓你的DEVONthink UI 介面更簡潔?devUI
- 設計模式入門-簡單工廠模式設計模式
- 提高網頁設計裡文字的易讀性網頁
- 直播系統app原始碼,簡潔好看的登入頁面APP原始碼
- 簡單的網頁登入頁面網頁
- 雲容器例項服務入門必讀
- Spring Boot 整合 Lombok 讓程式碼更簡潔Spring BootLombok
- 設計模式:簡單的鴨子模型(入門)設計模式模型
- 【HTML+CSS網頁設計與佈局 從入門到精通】第2章HTMLCSS網頁
- Smartour——讓網頁導覽變得更簡單網頁
- 入門必讀:糖果,空投,擼羊毛都是什麼?
- 【Python入門基礎】網路程式設計Python程式設計
- 商品詳情頁設計排版工具,零門檻入門使用指南!
- 【MMD】MikuMikuDance入門&必備網址整理
- 使用TS+Sequelize實現更簡潔的CRUD
- 使用 Laravel Eloquent 構造器讓模型更簡潔Laravel模型
- Go語言併發程式設計簡單入門Go程式設計
- Kubernetes 入門必備雲原生髮展簡史
- Python+django網頁設計入門(20):使用WebSocket建立多人線上聊天室PythonDjango網頁Web
- Python 3.8新功能盤點:更快,更簡潔,更一致,更現代化Python
- 2018年,14個網頁設計師必備技能助你拿高薪!網頁高薪
- 設計模式入門設計模式
- 一個徹底改變Redux的簡潔設計Redux
- 還在為你的簡歷苦惱嗎?程式設計師必讀!程式設計師