HTML:标記語言-中文百科頻道

簡介

由來

HTML的英文全稱是 Hyper Text Markup Language，即超文本标記語言。HTML是由Web的發明者Tim Berners-Lee和同事Daniel W.Connolly于1990年創立的一種标記語言，它是标準通用化标記語言SGML的應用。用HTML編寫的超文本文檔稱為HTML文檔，它能獨立于各種操作系統平台(如UNIX，Windows等)。使用HTML，将所需要表達的信息按某種規則寫成HTML文件，通過專用的浏覽器來識别，并将這些HTML文件“翻譯”成可以識别的信息，即現在所見到的網頁。

自1990年以來，HTML就一直被用作萬維網的信息表示語言，使用HTML描述的文件需要通過web浏覽器顯示出效果。HTML是一種建立網頁文件的語言，通過标記式的指令(Tag)，将影像、聲音、圖片、文字動畫、影視等内容顯示出來。事實上，每一個HTML文檔都是一種靜态的網頁文件，這個文件裡面包含了HTML指令代碼，這些指令代碼并不是一種程序語言，隻是一種排版網頁中資料顯示位置的标記結構語言，易學易懂，非常簡單。HTML的普遍應用就是帶來了超文本的技術―通過單擊鼠标從一個主題跳轉到另一個主題，從一個頁面跳轉到另一個頁面，與世界各地主機的文件鍊接超文本傳輸協議規定了浏覽器在運行HTML文檔時所遵循的規則和進行的操作。HTTP的制定使浏覽器在運行超文本時有了統一的規則和标準。

萬維網（world wide web，簡稱www）上的一個超媒體文檔稱之為一個頁面（外語：page）。作為一個組織或者個人在萬維網上放置開始點的頁面稱為主頁（外語：Homepage）或首頁，主頁中通常包括有指向其他相關頁面或其他節點的指針（超級鍊接），所謂超級鍊接，就是一種統一資源定位器（Uniform Resource Locator，外語縮寫：URL）指針，通過激活（點擊）它，可使浏覽器方便地獲取新的網頁。這也是HTML獲得廣泛應用的最重要的原因之一。在邏輯上将視為一個整體的一系列頁面的有機集合稱為網站（Website或Site）。超文本标記語言（英文縮寫：HTML）是為“網頁創建和其它可在網頁浏覽器中看到的信息”設計的一種标記語言。

網頁的本質就是超文本标記語言，通過結合使用其他的Web技術（如：腳本語言、公共網關接口、組件等），可以創造出功能強大的網頁。因而，超文本标記語言是萬維網（Web）編程的基礎，也就是說萬維網是建立在超文本基礎之上的。超文本标記語言之所以稱為超文本标記語言，是因為文本中包含了所謂“超級鍊接”點。

定義

超文本标記語言是标準通用标記語言下的一個應用，也是一種規範，一種标準，它通過标記符号來标記要顯示的網頁中的各個部分。網頁文件本身是一種文本文件，通過在文本文件中添加标記符，可以告訴浏覽器如何顯示其中的内容（如：文字如何處理，畫面如何安排，圖片如何顯示等）。浏覽器按順序閱讀網頁文件，然後根據标記符解釋和顯示其标記的内容，對書寫出錯的标記将不指出其錯誤，且不停止其解釋執行過程，編制者隻能通過顯示效果來分析出錯原因和出錯部位。但需要注意的是，對于不同的浏覽器，對同一标記符可能會有不完全相同的解釋，因而可能會有不同的顯示效果。

HTML版本

HTML是用來标記Web信息如何展示以及其他特性的一種語法規則，它最初于1989年由CERN的Tim Berners-Lee發明。HTML基于更古老一些的語言SGML定義，并簡化了其中的語言元素。這些元素用于告訴浏覽器如何在用戶的屏幕上展示數據，所以很早就得到各個Web浏覽器廠商的支持。

HTML曆史上有如下版本：

①HTML1。0：在1993年6月作為互聯網工程工作小組(IETF)工作草案發布。

②HTML2。0：1995年11月作為RFC1866發布，于2000年6月發布之後被宣布已經過時。

③HTML3。2：1997年1月14日，W3C推薦标準。

④HTML4。0：1997年12月18日，W3C推薦标準。

⑤HTML4。01（微小改進）：1999年12月24日，W3C推薦标準。

⑥HTML5：HTML5是公認的下一代Web語言，極大地提升了Web在富媒體、富内容和富應用等方面的能力，被喻為終将改變移動互聯網的重要推手。Internet Explorer8及以前的版本不支持。

HTML在Web迅猛發展的過程中起着重要作用，有着重要的地位。但随着網絡應用的深入，特别是電子商務的應用，HTML過于簡單的缺陷很快凸現出來：HTML不可擴展。HTML不允許應用程序開發者為具體的應用環境定義自定義的标記。HTML隻能用于信息顯示。HTML可以設置文本和圖片顯示方式，但沒有語義結構，即HTML顯示數據是按照布局而非語義的。随着網絡應用的發展，各行業對信息有着不同的需求，這些不同類型的信息未必都是以網頁的形式顯示出來。例如。當通過搜索引擎進行數據搜索時，按照語義而非按照布局來顯示數據會具有更多的優點。

互聯網的出現和飛速發展，徹底改變了人類社會獲取、處理與利用信息的方式和效率，并且正在将信息傳播的能量從網絡延伸到網絡之外更為廣闊的社會生活領域。其中，作為信息發布與交互平台的網站所發揮的作用至關重要。

總而言之，HTML的缺點使其交互性差，語義模糊，這些缺陷難以适應Internet飛速發展的要求，因此一個标準、簡潔、結構嚴謹以及可高度擴展的XML就産生了。

特點

超文本标記語言文檔制作不是很複雜，但功能強大，支持不同數據格式的文件鑲入，這也是萬維網（WWW）盛行的原因之一，其主要特點如下：

簡易性：超文本标記語言版本升級采用超集方式，從而更加靈活方便。

可擴展性：超文本标記語言的廣泛應用帶來了加強功能，增加标識符等要求，超文本标記語言采取子類元素的方式，為系統擴展帶來保證。

平台無關性：雖然個人計算機大行其道，但使用MAC等其他機器的大有人在，超文本标記語言可以使用在廣泛的平台上，這也是萬維網（WWW）盛行的另一個原因。

通用性：另外，HTML是網絡的通用語言，一種簡單、通用的全置标記語言。它允許網頁制作人建立文本與圖片相結合的複雜頁面，這些頁面可以被網上任何其他人浏覽到，無論使用的是什麼類型的電腦或浏覽器。

編輯方式

編輯

HTML其實是文本，它需要浏覽器的解釋，它的編輯器大體可以分為以下幾種：

基本文本、文檔編輯軟件，使用微軟自帶的記事本或寫字闆都可以編寫，當然，如果你用WPS或Word來編寫也可以，不過保存時請使用。htm或。html作為擴展名，這樣就方便浏覽器認出直接解釋執行了。

半所見即所得軟件，如：FCK-Editer、E-webediter等在線網頁編輯器；尤其推薦：Sublime Text代碼編輯器（由Jon Skinner開發，Sublime Text2收費但可以無限期試用）。

所見即所得軟件，使用最廣泛的編輯器，完全可以一點不懂HTML的知識就可以做出網頁，如：AMAYA（出品單位：萬維網聯盟）；FRONTPAGE（出品單位：微軟）；Dreamweaver（出品單位Adobe）。Microsoft Visual Studio（出品公司：微軟）：其中所見即所得軟件與半所見即所得的軟件相比，開發速度更快，效率更高，且直觀的表現更強。任何地方進行修改隻需要刷新即可顯示。缺點是生成的代碼結構複雜，不利于大型網站的多人協作和精準定位等高級功能的實現。

字符集

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

數據類型

超文本标記語言定義了多種數據類型的元素内容，如腳本數據和樣式表的數據，和衆多類型的屬性值，包括ID、名稱、URI、數字、長度單位、語言、媒體描述符、顔色、字符編碼、日期和時間等。所有這些數據類型都是專業的字符數據。

顯示結果

描述

實體名稱

實體編号

空格

小于号

大于号

和号

引号

撇号

'(IE不支持)

￠

分

￡

鎊

￥

日元

€

歐元

€

小節

版權

注冊商标

™

商标

™

乘号

除号

整體結構

一個網頁對應多個HTML文件，超文本标記語言文件以。htm或。html（外語縮寫）為擴展名(其中。htm是因為之前的文件系統隻支持最多三位擴展名)。可以使用任何能夠生成TXT類型源文件的文本編輯器來産生超文本标記語言文件，隻用修改文件後綴即可。标準的超文本标記語言文件都具有一個基本的整體結構，标記一般都是成對出現（部分标記除外例如：
），即超文本标記語言文件的開頭與結尾标志和超文本标記語言的頭部與實體兩大部分。有三個雙标記符用于頁面整體結構的确認。

部分标記也可以不成對出現，如

，但是一般并不贊同這樣做。

标記符，說明該文件是用超文本标記語言來描述的，它是文件的開頭;而，則表示該文件的結尾，它們是超文本标記語言文件的開始标記和結尾标記。

頭部内容

标記符：說明該文件是用超文本标記語言來描述的，它是文件的開頭，而則表示該文件的結尾，它們是超文本标記語言文件的開始标記和結尾标記。

：這2個标記符分别表示頭部信息的開始和結尾。頭部中包含的标記是頁面的标題、序言、說明等内容，它本身不作為内容來顯示，但影響網頁顯示的效果。頭部中最常用的标記符是标題标記符和meta标記符，其中标題标記符用于定義網頁的标題，它的内容顯示在網頁窗口的标題欄中，網頁标題可被浏覽器用做書簽和收藏清單。

标簽

描述

定義了文檔的信息

定義了文檔的标題</tr><tr><base>定義了頁面鍊接标簽的默認鍊接地址</tr><tr><link>定義了一個文檔和外部資源之間的關系</tr><tr><meta>定義了HTML文檔中的元數據</tr><tr><script>定義了客戶端的腳本文件</tr><tr><style>定義了HTML文檔的樣式文件</tr></table><h3>主體内容</h3><body><body/>；，網頁中顯示的實際内容均包含在這2個正文标記符之間。正文标記符又稱為實體标記。<ul style="list-style-type:disc;">标題：總共有6個等級，定義方法如下<h1><h1/>定義一級标題<h2><h2/>定義二級标題<h3><h3/>定義三級标題<h4><h4/>定義四級标題<h5><h5/>定義五級标題<h6><h6/>定義六級标題以此類推<ul style="list-style-type:disc;">文本定義文本<ul style="list-style-type:disc;">換行符 換行符<table style="width:322px;"><caption>示例：</caption><colgroup><col width="38" /><col width="284" /></colgroup><tr>1234567891011121314151617181920<!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/>定義文本随便字符 《-換行符<body/><html/></tr></table><h2>相關要求</h2>在編輯超文本标記語言文件和使用有關标記符時有一些約定或默認的要求。文本标記語言源程序的文件擴展名默認使用htm（磁盤操作系統DOS限制的外語縮寫為擴展名）或html（外語縮寫為擴展名），以便于操作系統或程序辨認，除自定義的漢字擴展名。在使用文本編輯器時，注意修改擴展名。而常用的圖像文件的擴展名為gif和jpg。超文本标記語言源程序為文本文件，其列寬可不受限制，即多個标記可寫成一行，甚至整個文件可寫成一行；若寫成多行，浏覽器一般忽略文件中的回車符（标記指定除外）；對文件中的空格通常也不按源程序中的效果顯示。完整的空格可使用特殊符号（實體符）“ （注意此字母必須小寫，方可空格）”表示非換行空格；表示文件路徑時使用符号“/”分隔，文件名及路徑描述可用雙引号也可不用引号括起。标記符中的标記元素用尖括号括起來，帶斜杠的元素表示該标記說明結束；大多數标記符必須成對使用，以表示作用的起始和結束；标記元素忽略大小寫，即其作用相同，但完整的空格可使用特殊符号“ （注意此字母必須小寫，方可空格）”；許多标記元素具有屬性說明，可用參數對元素作進一步的限定，多個參數或屬性項說明次序不限，其間用空格分隔即可；一個标記元素的内容可以寫成多行。标記符号，包括尖括号、标記元素、屬性項等必須使用半角的西文字符，而不能使用全角字符。HTML注釋由"“結束，例如。注釋内容可插入文本中任何位置。任何标記若在其最前插入感歎号，即被标識為注釋，不予顯示。 </article> 上一篇：<a href="/item/49081.html">按鈕</a> 下一篇：<a href="/item/49087.html">聽網</a> <h2>相關詞條</h2> <ul id="xgword"> <li> <a href="/item/2.html" ><img src="/static/assets/images/nopic.gif" border="0" alt="電位滴定儀" width="70px" height="70px" />電位滴定儀</a> </li> <li> <a href="/item/1.html" ><img src="/uploadfile/202412/dc4fa7763cbdf93.jpg" border="0" alt="色度儀" width="70px" height="70px" />色度儀</a> </li> <li> <a href="/item/44774.html" ><img src="/uploads/202201/a5c02c58816da0417b63c086cc46f186.jpg" border="0" alt="透光石" width="70px" height="70px" />透光石</a> </li> <li> <a href="/item/49045.html" ><img src="/uploads/202201/3a72d40b367146ae24699a4ffa6ef7b2.jpg" border="0" alt="MUI" width="70px" height="70px" />MUI</a> </li> <li> <a href="/item/49031.html" ><img src="/uploads/202201/0600227a70b32c86147fa239e6057e82.jpg" border="0" alt="聲卡" width="70px" height="70px" />聲卡</a> </li> <li> <a href="/item/49072.html" ><img src="/uploads/202201/994550420f35e926d2e12f95c5e83bf1.jpg" border="0" alt="TFSI發動機" width="70px" height="70px" />TFSI發動機</a> </li> <li> <a href="/item/49051.html" ><img src="/uploads/202201/a3f986e0aed18e939517081cccdf3f94.jpg" border="0" alt="SuperCache" width="70px" height="70px" />SuperCache</a> </li> <li> <a href="/item/49039.html" ><img src="/uploads/202201/2b5ba084296c22ecc9dc5f4ae334b606.jpg" border="0" alt="聯想Y530" width="70px" height="70px" />聯想Y530</a> </li> <li> <a href="/item/49075.html" ><img src="/uploads/202201/c1446ac3be25923a42de9d0ceaa91877.jpg" border="0" alt="信号量" width="70px" height="70px" />信号量</a> </li> <li> <a href="/item/48947.html" ><img src="/uploads/202201/081410d9314172aa014da3432d744de3.jpg" border="0" alt="88毫米高射炮" width="70px" height="70px" />88毫米高射炮</a> </li> <li> <a href="/item/49013.html" ><img src="/uploads/202201/befebff90e2a03c5f10bdccdb1b2895e.jpg" border="0" alt="路由器vpn" width="70px" height="70px" />路由器vpn</a> </li> <li> <a href="/item/48965.html" ><img src="/uploads/202201/0a3ddaa58ac25b641f990299dc479e51.jpg" border="0" alt="公道杯" width="70px" height="70px" />公道杯</a> </li> <li> <a href="/item/48941.html" ><img src="/uploads/202201/74701069f9b3e47407011484b9f3749c.jpg" border="0" alt="投石車" width="70px" height="70px" />投石車</a> </li> <li> <a href="/item/49063.html" ><img src="/uploads/202201/5e232e211e9485b7a0cad9c063cc53f6.jpg" border="0" alt="外置顯卡" width="70px" height="70px" />外置顯卡</a> </li> <li> <a href="/item/48938.html" ><img src="/uploads/202201/f60e5c469144477c639d41d7f31fec35.jpg" border="0" alt="手闆" width="70px" height="70px" />手闆</a> </li> <li> <a href="/item/49060.html" ><img src="/uploads/202201/8c02f025f148a4a8515d92df2d47108e.jpg" border="0" alt="su9400" width="70px" height="70px" />su9400</a> </li> <li> <a href="/item/49078.html" ><img src="/uploads/202201/cd72263e61120556624437c36301180a.jpg" border="0" alt="http" width="70px" height="70px" />http</a> </li> <li> <a href="/item/48962.html" ><img src="/uploads/202201/04b191d827f25821004751400a098115.jpg" border="0" alt="搪玻璃" width="70px" height="70px" />搪玻璃</a> </li> <li> <a href="/item/48983.html" ><img src="/uploads/202201/00f4b642f0b2d53d5a7bf72db32562de.gif" border="0" alt="api接口" width="70px" height="70px" />api接口</a> </li> <li> <a href="/item/49001.html" ><img src="/uploads/202201/01727f033bc855c2cb7a2ce5e8e22f4c.jpg" border="0" alt="光電鼠标" width="70px" height="70px" />光電鼠标</a> </li> </ul> <div style="clear: both"></div> <h2>相關搜索</h2> <ul id="xlword"> <li> <a href="/item/311989.html" >良構xhtml</a> </li> <li> <a href="/item/310188.html" >vhtml</a> </li> <li> <a href="/item/262543.html" >XHTML</a> </li> <li> <a href="/item/171570.html" >html代碼</a> </li> <li> <a href="/item/97290.html" >html編輯器</a> </li> <li> <a href="/item/49084.html" >HTML</a> </li> <li> <a href="/item/45648.html" >HTML5</a> </li> <li> <a href="/item/5938.html" >html标簽</a> </li> </ul> <div style="clear: both"></div> <h2>其它詞條</h2> <ul id="xlword"> <li> <a href="/item/343.html" >紅枝蒲桃</a> </li> <li> <a href="/item/368.html" >紅松</a> </li> <li> <a href="/item/334.html" >天女木蘭花</a> </li> <li> <a href="/item/360.html" >漢麻</a> </li> <li> <a href="/item/317623.html" >李萬祺</a> </li> <li> <a href="/item/2.html" >電位滴定儀</a> </li> <li> <a href="/item/314203.html" >望月有感</a> </li> <li> <a href="/item/158663.html" >瓊瑤</a> </li> <li> <a href="/item/109.html" >合歡花</a> </li> <li> <a href="/item/102.html" >水稻</a> </li> <li> <a href="/item/1.html" >色度儀</a> </li> <li> <a href="/item/385.html" >海紅果</a> </li> <li> <a href="/item/391.html" >南非萬壽菊</a> </li> <li> <a href="/item/78757.html" >宋昰昀</a> </li> <li> <a href="/item/3198.html" >無花果</a> </li> <li> <a href="/item/418.html" >翠菊</a> </li> <li> <a href="/item/450.html" >紫花玉簪</a> </li> <li> <a href="/item/424.html" >金壇雀舌</a> </li> <li> <a href="/item/21536.html" >司馬相如</a> </li> <li> <a href="/item/21512.html" >司馬徽</a> </li> </ul> </div> </div> </div> <script> if (document.documentElement.clientWidth < 768) { document.writeln('<script src="/static/default/web/scripts/tocmobile.js"><\/script>'); document.writeln( '<link rel="stylesheet" type="text/css" href="/static/default/web/css/dirmobile.css" \/>' ); } else { if ( document.documentElement.offsetHeight > 768 || document.body.offsetHeight > 768 ) { document.writeln('<div class="post-nav"> '); document.writeln('<div class="nav-heading">百科目錄</div> '); document.writeln('<div id="toc"></div> '); document.writeln("</div>"); document.write('<script src="/static/default/web/scripts/tocify.js"><\/script>'); document.write( '<link rel="stylesheet" type="text/css" href="/static/default/web/css/dir.css" />' ); } } </script> <script> if (document.documentElement.clientWidth < 768) { $("article").autoc(); $("a[href^=#][href!=#]").click(function () { var target = document.getElementById(this.hash.slice(1)); if (!target) return; var targetOffset = $(target).offset().top - 46; $("body").animate({ scrollTop: targetOffset }, 1000); $("#toc").window.close(); return false; }); } </script> <div id="footer"> HTML-标記語言<a href="/">中文百科頻道</a> </div> </body> </html>