複製鏈接
請複製以下鏈接發送給好友

HTML

鎖定
HTML的全稱為超文本標記語言,是一種標記語言。它包括一系列標籤,通過這些標籤可以將網絡上的文檔格式統一,使分散的Internet資源連接為一個邏輯整體。HTML文本是由HTML命令組成的描述性文本,HTML命令可以説明文字,圖形、動畫、聲音、表格、鏈接等。 [1] 
超文本是一種組織信息的方式,它通過超級鏈接方法將文本中的文字、圖表與其他信息媒體相關聯。這些相互關聯的信息媒體可能在同一文本中,也可能是其他文件,或是地理位置相距遙遠的某台計算機上的文件。這種組織信息方式將分佈在不同位置的信息資源用隨機方式進行連接,為人們查找,檢索信息提供方便。 [1] 
中文名
超文本標記語言
外文名
Hyper Text Markup Language
類    型
標記語言
閲讀方式
網頁瀏覽器
外語縮寫
HTML
文件擴展名
html或htm

HTML簡介

HTML由來

HTML的英文全稱是 Hyper Text Markup Language,即超文本標記語言。HTML是由Web的發明者 Tim Berners-Lee和同事 Daniel W. Connolly於1990年創立的一種標記語言,它是標準通用化標記語言SGML的應用。用HTML編寫的超文本文檔稱為HTML文檔,它能獨立於各種操作系統平台(如UNIX, Windows等)。使用HTML,將所需要表達的信息按某種規則寫成HTML文件,通過專用的瀏覽器來識別,並將這些HTML文件“翻譯”成可以識別的信息,即我們所見到的網頁。 [2] 
自1990年以來,HTML就一直被用作萬維網的信息表示語言,使用HTML描述的文件需要通過web瀏覽器顯示出效果。HTML是一種建立網頁文件的語言,通過標記式的指令(Tag),將文字,圖形、動畫、聲音、表格、鏈接、影像等內容顯示出來。事實上,每一個HTML文檔都是一種靜態的網頁文件,這個文件裏面包含了HTML指令代碼,這些指令代碼並不是一種程序語言,只是一種排版網頁中資料顯示位置的標記結構語言,易學易懂,非常簡單。HTML的普遍應用就是帶來了超文本的技術―通過單擊鼠標從一個主題跳轉到另一個主題,從一個頁面跳轉到另一個頁面,與世界各地主機的文件鏈接超文本傳輸協議規定了瀏覽器在運行HTML文檔時所遵循的規則和進行的操作。HTTP的制定使瀏覽器在運行超文本時有了統一的規則和標準。 [2] 
萬維網(world wide web,簡稱www)上的一個超媒體文檔稱之為一個頁面(外語:page)。作為一個組織或者個人在萬維網上放置開始點的頁面稱為主頁(外語:Homepage)或首頁,主頁中通常包括有指向其他相關頁面或其他節點的指針(超級鏈接),所謂超級鏈接,就是一種統一資源定位器(Uniform Resource Locator,外語縮寫:URL)指針,通過激活(點擊)它,可使瀏覽器方便地獲取新的網頁。這也是HTML獲得廣泛應用的最重要的原因之一。在邏輯上將視為一個整體的一系列頁面的有機集合稱為網站(Website或Site)。超文本標記語言(英文縮寫:HTML)是為“網頁創建和其它可在網頁瀏覽器中看到的信息”設計的一種標記語言 [3] 
網頁的本質就是超文本標記語言,通過結合使用其他的Web技術(如:腳本語言公共網關接口、組件等),可以創造出功能強大的網頁。因而,超文本標記語言是萬維網(Web)編程的基礎,也就是説萬維網是建立在超文本基礎之上的。超文本標記語言之所以稱為超文本標記語言,是因為文本中包含了所謂“超級鏈接”點。 [4] 

HTML定義

超文本標記語言是標準通用標記語言下的一個應用,也是一種規範,一種標準,它通過標記符號來標記要顯示的網頁中的各個部分。網頁文件本身是一種文本文件,通過在文本文件中添加標記符,可以告訴瀏覽器如何顯示其中的內容(如:文字如何處理,畫面如何安排,圖片如何顯示等)。瀏覽器按順序閲讀網頁文件,然後根據標記符解釋和顯示其標記的內容,對書寫出錯的標記將不指出其錯誤,且不停止其解釋執行過程,編制者只能通過顯示效果來分析出錯原因和出錯部位。但需要注意的是,對於不同的瀏覽器,對同一標記符可能會有不完全相同的解釋,因而可能會有不同的顯示效果。 [3] 

HTMLHTML版本

HTML是用來標記Web信息如何展示以及其他特性的一種語法規則,它最初於1989年由CERN的Tim Berners-Lee發明。HTML基於更古老一些的語言SGML定義,並簡化了其中的語言元素。這些元素用於告訴瀏覽器如何在用户的屏幕上展示數據,所以很早就得到各個Web瀏覽器廠商的支持。 [5] 
HTML歷史上有如下版本: [5] 
①HTML 1.0:在1993年6月作為互聯網工程工作小組(IETF)工作草案發布。 [5] 
HTML 2.0:1995年1 1月作為RFC 1866發佈,於2000年6月發佈之後被宣佈已經過時。 [5] 
③HTML 3.2:1997年1月14日,W3C推薦標準。 [5] 
④HTML 4.0:1997年12月18日,W3C推薦標準。 [5] 
HTML 4.01(微小改進):1999年12月24日,W3C推薦標準。 [5] 
⑥HTML 5:HTML5是公認的下一代Web語言,極大地提升了Web在富媒體、富內容和富應用等方面的能力,被喻為終將改變移動互聯網的重要推手。Internet Explorer 8及以前的版本不支持。 [6] 
HTML在Web迅猛發展的過程中起着重要作用,有着重要的地位。但隨着網絡應用的深入,特別是電子商務的應用,HTML過於簡單的缺陷很快凸現出來:HTML不可擴展。HTML不允許應用程序開發者為具體的應用環境定義自定義的標記。HTML只能用於信息顯示。HTML可以設置文本和圖片顯示方式,但沒有語義結構,即HTML顯示數據是按照佈局而非語義的。隨着網絡應用的發展,各行業對信息有着不同的需求,這些不同類型的信息未必都是以網頁的形式顯示出來。例如,當通過搜索引擎進行數據搜索時,按照語義而非按照佈局來顯示數據會具有更多的優點。
總而言之,HTML的缺點使其交互性差,語義模糊,這些缺陷難以適應Internet飛速發展的要求,因此一個標準、簡潔、結構嚴謹以及可高度擴展的XML就產生了。

HTML特點

超文本標記語言文檔製作不是很複雜,但功能強大,支持不同數據格式的文件鑲入,這也是萬維網(WWW)盛行的原因之一,其主要特點如下: [4] 
  1. 簡易性:超文本標記語言版本升級採用超集方式,從而更加靈活方便。 [4] 
  2. 可擴展性:超文本標記語言的廣泛應用帶來了加強功能,增加標識符等要求,超文本標記語言採取子類元素的方式,為系統擴展帶來保證。 [4] 
  3. 平台無關性:雖然個人計算機大行其道,但使用MAC等其他機器的大有人在,超文本標記語言可以使用在廣泛的平台上,這也是萬維網(WWW)盛行的另一個原因。 [4] 
  4. 通用性:另外,HTML是網絡的通用語言,一種簡單、通用的全置標記語言。它允許網頁製作人建立文本與圖片相結合的複雜頁面,這些頁面可以被網上任何其他人瀏覽到,無論使用的是什麼類型的電腦或瀏覽器。 [4] 

HTML編輯方式

HTML編輯

HTML其實是文本,它需要瀏覽器的解釋,它的編輯器大體可以分為以下幾種:
  1. 基本文本、文檔編輯軟件,使用微軟自帶的記事本寫字板都可以編寫,當然,如果你用WPS或Word來編寫也可以,不過保存時請使用.htm或.html作為擴展名,這樣就方便瀏覽器認出直接解釋執行了。 [7] 
  2. 半所見即所得軟件,如:FCK-Editer、E-webediter等在線網頁編輯器;尤其推薦:Sublime Text代碼編輯器(由Jon Skinner開發,Sublime Text2收費但可以無限期試用)。 [7] 
  3. 所見即所得軟件,使用最廣泛的編輯器,完全可以一點不懂HTML的知識就可以做出網頁,如:AMAYA(出品單位:萬維網聯盟);FRONTPAGE(出品單位:微軟);Dreamweaver(出品單位Adobe)。Microsoft Visual Studio(出品公司:微軟):其中所見即所得軟件與半所見即所得的軟件相比,開發速度更快,效率更高,且直觀的表現更強。任何地方進行修改只需要刷新即可顯示。缺點是生成的代碼結構複雜,不利於大型網站的多人協作和精準定位等高級功能的實現。 [7] 

HTML字符集

字符集 字符集
除了常見的ASCII字符和漢字,HTML還有許多特殊字符,它們一起構成了HTML字符集。有2種情況需要使用特殊字符,一是網頁中有其特殊意義的字符,二是鍵盤上沒有的字符。HTML字符可以用一些代碼來表示,代碼可以有2種表示方式。即字符代碼(命名實體)和數字代碼(編號實體)。字符代碼以“&”符開始,以分號";"結束,其間是字符名,如®。數字代碼也以“&#”符開始,以分號";"結束,其間是編號,如®。 [8] 

HTML數據類型

html示例 html示例
超文本標記語言定義了多種數據類型的元素內容,如腳本數據和樣式表的數據,和眾多類型的屬性值,包括ID、名稱、URI、數字、長度單位、語言、媒體描述符、顏色、字符編碼、日期和時間等。所有這些數據類型都是專業的字符數據。 [9] 

HTML常見實體

顯示結果
描述
實體名稱
實體編號

空格
 

<
小於號
&lt;
<
>
大於號
&gt;
>
&
和號
&amp;
&
"
引號
&quot;
"
'
撇號
&apos; (IE不支持)
'
&cent;
¢
&pound;
£
人民幣、日元
&yen;
¥
歐元
&euro;
§
小節
&sect;
§
©
版權
&copy;
©
®
註冊商標
&reg;
®
商標
&trade;
×
乘號
&times;
×
÷
除號
&divide;
÷

HTML整體結構

一個網頁對應多個HTML文件,超文本標記語言文件以.htm或.html(外語縮寫)為擴展名(其中.htm是因為之前的文件系統只支持最多三位擴展名)。可以使用任何能夠生成TXT類型源文件文本編輯器來產生超文本標記語言文件,只用修改文件後綴即可。標準的超文本標記語言文件都具有一個基本的整體結構,標記一般都是成對出現(部分標記除外例如:<br/> <img/>),即超文本標記語言文件的開頭與結尾標誌和超文本標記語言的頭部與實體兩大部分。有三個雙標記符用於頁面整體結構的確認。 [10] 
部分標記也可以不成對出現,如<p>,但是一般並不贊同這樣做。
標記符<html>,説明該文件是用超文本標記語言來描述的,它是文件的開頭;而</html>,則表示該文件的結尾,它們是超文本標記語言文件的開始標記和結尾標記。 [10] 

HTML頭部內容

標記符<html>:説明該文件是用超文本標記語言來描述的,它是文件的開頭,而</html>則表示該文件的結尾,它們是超文本標記語言文件的開始標記和結尾標記。 [10] 
<head></head>:這2個標記符分別表示頭部信息的開始和結尾。頭部中包含的標記是頁面的標題、序言、説明等內容,它本身不作為內容來顯示,但影響網頁顯示的效果。頭部中最常用的標記符是標題標記符和meta標記符,其中標題標記符用於定義網頁的標題,它的內容顯示在網頁窗口的標題欄中,網頁標題可被瀏覽器用做書籤和收藏清單。 [10] 
以下表格列出了 HTML head 元素:
標籤
描述
定義了文檔的信息
定義了文檔的標題
定義了頁面鏈接標籤的默認鏈接地址
定義了一個文檔和外部資源之間的關係
定義了HTML文檔中的元數據
定義了客户端的腳本文件
定義了HTML文檔的樣式文件

HTML主體內容

<body></body>;,網頁中顯示的實際內容均包含在這2個正文標記符之間。正文標記符又稱為實體標記。 [10] 
  • 標題:總共有6個等級,定義方法如下
<h1></h1>定義一級標題
<h2></h2>定義二級標題
<h3></h3>定義三級標題
<h4></h4>定義四級標題
<h5></h5>定義五級標題
<h6></h6>定義六級標題
以此類推
  • 文本
<p></p>定義文本
  • 換行符
示例: [1] 
<!DOCTYPE html>
<html lang="en">
<head>    
  <meta charset="UTF-8">    
  <title>Title</title>
</head>

<body>
  <h1>這是一級標題</h1>
  <h2>這是二級標題</h2>
  <h3>這是三級標題</h3>
  <h4>這是四級標題</h4>
  <h5>這是五級標題</h5>
  <h6>這是六級標題</h6>
   
  <p>定義文本</p>
  
  <p>隨便字符<br/>《-換行符</p>
</body>
</html>

HTML相關要求

在編輯超文本標記語言文件和使用有關標記符時有一些約定或默認的要求。 [9] 
  1. 文本標記語言源程序的文件擴展名默認使用htm(磁盤操作系統DOS限制的外語縮寫為擴展名)或html(外語縮寫為擴展名),以便於操作系統程序辨認,除自定義的漢字擴展名。在使用文本編輯器時,注意修改擴展名。而常用的圖像文件的擴展名為gifjpg [9] 
  2. 超文本標記語言源程序為文本文件,其列寬可不受限制,即多個標記可寫成一行,甚至整個文件可寫成一行;若寫成多行,瀏覽器一般忽略文件中的回車符(標記指定除外);對文件中的空格通常也不按源程序中的效果顯示。完整的空格可使用特殊符號(實體符)“&nbsp(注意此字母必須小寫,方可空格)”表示非換行空格;表示文件路徑時使用符號“/”分隔,文件名及路徑描述可用雙引號也可不用引號括起。 [9] 
  3. 標記符中的標記元素用尖括號括起來,帶斜槓的元素表示該標記説明結束;大多數標記符必須成對使用,以表示作用的起始和結束;標記元素忽略大小寫,即其作用相同,但完整的空格可使用特殊符號“&nbsp(注意此字母必須小寫,方可空格)”;許多標記元素具有屬性説明,可用參數對元素作進一步的限定,多個參數屬性項説明次序不限,其間用空格分隔即可;一個標記元素的內容可以寫成多行。 [9] 
  4. 標記符號,包括尖括號、標記元素、屬性項等必須使用半角的西文字符,而不能使用全角字符 [9] 
  5. HTML註釋由"<!--"號開始,由符號”-->“結束,例如<!--註釋內容-->。註釋內容可插入文本中任何位置。任何標記若在其最前插入感嘆號,即被標識為註釋,不予顯示。 [9] 
HTML HTML
參考資料
  • 1.    孫素華編著.Dreamweaver CS5 Flash CS5 Photoshop CS5網頁設計從入門到精通:中國青年出版社,2014.10:第16頁
  • 2.    張季謙,仲志平,王再見編著.網頁設計與製作 第2版:中國科學技術大學出版社,2017.01:第13頁
  • 3.    Cameron Barrows. The construction of a queer rhizomatic hermeneutics through an exploration of Dennis Cooper's HTML novels[J]. Orbis Litterarum,2019,74(3).
  • 4.    康梅娟,李英奎,郭狀先等編著.網站建設與維護:山東人民出版社,2014.06:第22頁
  • 5.    李紅,岳雲康,樊東燕主編.電子商務網頁設計:中國鐵道出版社,2016.09:第26頁
  • 6.    賈志淳,邢星,張宇峯編著.移動雲計算技術專題研究:東北大學出版社,2016.04:第193頁
  • 7.    劉宇主編;倪問尹副主編;邊耐政主審.網絡技術編:湖南大學出版社,2014.11:第121頁
  • 8.    武仁杰主編;王志輝,米海英,郭曉玲副主編;郭喜鳳主審.WEB 程序設計:中國鐵道出版社,2015.08:第16頁
  • 9.    鄭永愛,秦曉燕.《HTML語言基礎與網頁設計》教學模式改革研究[J].數字通信世界,2019(05):230-231.
  • 10.    雲海科技編著.網頁設計藝術:北京希望出版社,2015.01:第127頁