-
HTML
鎖定
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:HTML5是公認的下一代Web語言,極大地提升了Web在富媒體、富內容和富應用等方面的能力,被喻為終將改變移動互聯網的重要推手。Internet Explorer 8及以前的版本不支持。
[6]
HTML在Web迅猛發展的過程中起着重要作用,有着重要的地位。但隨着網絡應用的深入,特別是電子商務的應用,HTML過於簡單的缺陷很快凸現出來:HTML不可擴展。HTML不允許應用程序開發者為具體的應用環境定義自定義的標記。HTML只能用於信息顯示。HTML可以設置文本和圖片顯示方式,但沒有語義結構,即HTML顯示數據是按照佈局而非語義的。隨着網絡應用的發展,各行業對信息有着不同的需求,這些不同類型的信息未必都是以網頁的形式顯示出來。例如,當通過搜索引擎進行數據搜索時,按照語義而非按照佈局來顯示數據會具有更多的優點。
總而言之,HTML的缺點使其交互性差,語義模糊,這些缺陷難以適應Internet飛速發展的要求,因此一個標準、簡潔、結構嚴謹以及可高度擴展的XML就產生了。
HTML特點
HTML編輯方式
HTML編輯
HTML其實是文本,它需要瀏覽器的解釋,它的編輯器大體可以分為以下幾種:
- 半所見即所得軟件,如:FCK-Editer、E-webediter等在線網頁編輯器;尤其推薦:Sublime Text代碼編輯器(由Jon Skinner開發,Sublime Text2收費但可以無限期試用)。 [7]
- 所見即所得軟件,使用最廣泛的編輯器,完全可以一點不懂HTML的知識就可以做出網頁,如:AMAYA(出品單位:萬維網聯盟);FRONTPAGE(出品單位:微軟);Dreamweaver(出品單位Adobe)。Microsoft Visual Studio(出品公司:微軟):其中所見即所得軟件與半所見即所得的軟件相比,開發速度更快,效率更高,且直觀的表現更強。任何地方進行修改只需要刷新即可顯示。缺點是生成的代碼結構複雜,不利於大型網站的多人協作和精準定位等高級功能的實現。 [7]
HTML字符集
除了常見的ASCII字符和漢字,HTML還有許多特殊字符,它們一起構成了HTML字符集。有2種情況需要使用特殊字符,一是網頁中有其特殊意義的字符,二是鍵盤上沒有的字符。HTML字符可以用一些代碼來表示,代碼可以有2種表示方式。即字符代碼(命名實體)和數字代碼(編號實體)。字符代碼以“&”符開始,以分號";"結束,其間是字符名,如®。數字代碼也以“&#”符開始,以分號";"結束,其間是編號,如®。
[8]
HTML數據類型
超文本標記語言定義了多種數據類型的元素內容,如腳本數據和樣式表的數據,和眾多類型的屬性值,包括ID、名稱、URI、數字、長度單位、語言、媒體描述符、顏色、字符編碼、日期和時間等。所有這些數據類型都是專業的字符數據。
[9]
HTML常見實體
顯示結果 | 描述 | 實體名稱 | 實體編號 |
---|---|---|---|
空格 | | ||
< | 小於號 | < | < |
> | 大於號 | > | > |
& | 和號 | & | & |
" | 引號 | " | " |
' | 撇號 | ' (IE不支持) | ' |
¢ | 分 | ¢ | ¢ |
£ | 鎊 | £ | £ |
¥ | 人民幣、日元 | ¥ | ¥ |
€ | 歐元 | € | € |
§ | 小節 | § | § |
© | 版權 | © | © |
® | 註冊商標 | ® | ® |
™ | 商標 | ™ | ™ |
× | 乘號 | × | × |
÷ | 除號 | ÷ | ÷ |
HTML整體結構
一個網頁對應多個HTML文件,超文本標記語言文件以.htm或.html(外語縮寫)為擴展名(其中.htm是因為之前的文件系統只支持最多三位擴展名)。可以使用任何能夠生成TXT類型源文件的文本編輯器來產生超文本標記語言文件,只用修改文件後綴即可。標準的超文本標記語言文件都具有一個基本的整體結構,標記一般都是成對出現(部分標記除外例如:<br/> <img/>),即超文本標記語言文件的開頭與結尾標誌和超文本標記語言的頭部與實體兩大部分。有三個雙標記符用於頁面整體結構的確認。
[10]
部分標記也可以不成對出現,如<p>,但是一般並不贊同這樣做。
HTML頭部內容
<head></head>:這2個標記符分別表示頭部信息的開始和結尾。頭部中包含的標記是頁面的標題、序言、説明等內容,它本身不作為內容來顯示,但影響網頁顯示的效果。頭部中最常用的標記符是標題標記符和meta標記符,其中標題標記符用於定義網頁的標題,它的內容顯示在網頁窗口的標題欄中,網頁標題可被瀏覽器用做書籤和收藏清單。
[10]
以下表格列出了 HTML head 元素:
標籤 | 描述 |
---|---|
定義了文檔的信息 | |
定義了文檔的標題 | |
定義了頁面鏈接標籤的默認鏈接地址 | |
定義了一個文檔和外部資源之間的關係 | |
定義了HTML文檔中的元數據 | |
定義了客户端的腳本文件 | |
定義了HTML文檔的樣式文件 |
HTML主體內容
- 標題:總共有6個等級,定義方法如下
<h1></h1>定義一級標題
<h2></h2>定義二級標題
<h3></h3>定義三級標題
<h4></h4>定義四級標題
<h5></h5>定義五級標題
<h6></h6>定義六級標題
以此類推
- 文本
<p></p>定義文本
- 換行符
<br/>換行符
<!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相關要求
- 參考資料
-
- 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頁