瀏覽器內核：

• IE: trident
• Fixfox: gecko
• Safari: webkit
• Opera: 以前是presto,現已改用Google Chrome的Blink
• Chrome: Blink(基于Webkit)

DOCTYPE:

　　<!DOCTYPE>文檔類型聲明，位于文檔中的最前面位置，處于<thml>標簽之前。

　　作用：告訴瀏覽器按照何種規范解析頁面

瀏覽器模式：（標準模式 or 混雜模式）

　　標準模式：根據W3c規范呈現頁面

　　混雜模式：以一種比較寬松的向下兼容的方式呈現頁面

　　兩者區別：

盒模型的解析

　　　　　　　　標準模式下，盒模型的內容寬度和高度不包括padding和border值，而混雜模式下包括padding和border值。

　　　　　　　　　可用box-sizing進行計算。

　　　　　　2.給行內元素設置寬高

　　　　　　　　標準模式下，給<span>等行內元素設置width和height都不會生效，而在混雜模式中會生效。

　　　　　3.設置百分比高度

　　　　　　　　標準模式下，一個元素的高度由其內容的大小來決定，如果沒有給父元素設置height值,子元素設置百分比的height是無效的，而在混雜模式下生效。

?

　　（ps:這些是我在編寫項目中遇到的一些區別，應該還有很多）

漸進增強、優雅降級：

　　漸進增強：一開始只構建站點的最少特性，然后不斷針對瀏覽器追加功能。

　　優雅降級：一開始就構建站點的完整功能，然后針對瀏覽器測試和修復。

　　微妙差別：都關注于同一網站在不同瀏覽器下的表現程度。區別在于它們的關注點不同，以及這種關注如何影響工作的流程。

語義化：

　　使用含有語義的標簽，起到強調作用，很明顯的告訴你它們的作用是什么。

　　好處：　

　　　　去掉樣式后頁面呈現清晰的結構

　　　　盲人使用讀屏器更好的閱讀

　　　　搜索引擎更好的理解頁面

　　　　便于團隊項目的可持續運作及維護

塊元素、行內元素：

　　塊元素：div p h1~h6 ul li address form table section article aside nav header hgroup footer

　　行內元素：span th tr td a label textarea input select img ?button time,其中，textarea input select img button?time又叫內聯塊級元素。

　　區別：塊級元素會獨占一行，默認情況下，其寬度會自動填滿父元素的寬度，行內元素不會獨占一行，相鄰的行內元素會排列在同一行里，直到一行排不下，才會換行，其寬度隨內容而變化,內聯塊級元素可以使用css為其設置寬高，但不會獨占一行。

HTML5:

　　html5主要是關于圖像、位置、存諸等功能的增加。

　　語義化更好的內容標簽：header nav footer aside article section

　　音頻、視頻：audio video

　　畫布：canvas

　　拖放

　　本地存諸：localStorage(永久存諸，瀏覽器關閉后數據不丟失，需手動刪除)

　　　　　　　sessionStorage(臨時存諸，瀏覽器關閉后自動刪除)

　　離線應用

　　新增表單類型：email url number range date search

　　移除元素：

　　　　純表現的元素：basefont big center font u...

　　　　不再使用frame框架

轉載于:https://www.cnblogs.com/pwei/p/html-carding.html

總結

以上是生活随笔為你收集整理的知识梳理——HTML篇的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。