1.如何理解它的名字?
A.HTML的“超文本”指,除了文字這種純文本外,它還可以表示圖片、視頻、音頻等不是文本的內容。
B.HTML的“標記”指,HTML用標簽定義網頁中的內容,以便瀏覽器能準確把這些內容展示出來。
C.HTML的“語言”指,它是與瀏覽器溝通的語言,瀏覽器通過聽懂HTML這種特殊的語言,準確顯示網頁內容。
就名稱來看,HTML是一門語言?它有單詞嗎?單詞組成句子有語法嗎?這個語言是誰用的呢?
2.如何理解它是一門語言?
HTML作為一門特殊的語言,可類比漢語、英語:
A.標簽:可理解為HTML的單詞;跟人類語言的單詞有含義一樣,每個HTML標簽也有不同的語義,如<header>表示頭部,<nav>表示導航。跟英語相比,HTML的單詞數很少(114個,常用的也就那么十幾二十個吧?)。
相比記憶,學會查找或許更重要。MDN(HTML 元素參考)和W3C(HTML 教程)是不可或缺的查找字典。
B.元素:一個開始標簽+內容+一個結束標簽組成HTML的元素。一個元素可理解為HTML的一個句子;雖然大多數元素有結束標簽,但也有例外,如<img>。
C.html文件:一個.html格式的文件就是一篇HTML的文章,可包含若干個元素。
當閱讀.html格式的文件時,正是因為標簽有語義,即使不用瀏覽器將文件翻譯出來(準確表達應該是渲染出來?姑且用“翻譯”來理解吧),你也可以想象這篇文章想要表達一個什么樣的網頁。語義化標簽組成的網頁,可以讓搜索引擎更好解析,有助于提高網頁在搜索結果中的排名(seo優化)。
3.它有語法嗎?是什么?
跟英語的單詞,每個都有獨特的用法一樣,不同的HTML標簽也有不同的用法。如大多數標簽要求有結束標記;部分則不需要,如<img>。此外,想要寫出能表達更多意思的句子,單詞需與其他詞搭配使用,同理,每個HTML標簽也有搭配用法,稱之為“屬性”。如<img>的width、height,借助這兩個屬性,圖片大小將更符合設計。
隨著表達的需要,語言的詞庫在不斷更新,如出現網絡新詞;不常用、不方便使用(魑魅魍魎)的慢慢很少被使用,甚至被被棄用。隨著網頁表現形式的豐富,HTML的詞庫也在不斷更新,HTML4.0、HTML5.0標準應運而生。相比,HTML5標準做出了<strike>被棄用,新增<aside>等變更。(HTML標準就是限制你這樣寫HTML文件,但不能那樣寫的規定)
4.它是如何跟瀏覽器溝通的?
HTML文件的每一部分,代表了瀏覽器解析文件所需的關鍵信息,方便瀏覽器能更好理解、準確解析:
A.<!DOCTYPE html>:聲明文檔類型。當瀏覽器解析HTML文件時,會先查找此聲明,以確定用哪種方式渲染網站。此語句相當于告訴瀏覽器:這是一個HTML文檔,請按HTML5的標準解析它。
B.<head></head>:描述網頁的基礎信息;如<title>標簽定義的標題;<meta>標簽定義的css 樣式表、js文件、編碼方式等。這些信息幫助瀏覽器更好的理解頁面,如<meta chartset=UTF-8>告訴瀏覽器應使用utf編碼。
C.<body></body>:用若干個元素定義了用戶在網頁上看到的內容,如一張圖、一段文字。元素中可以嵌套其他元素,使文件呈樹狀層級結構:
今天就講到這里 希望對大家能有所幫助。一如既往,歡迎點評!