Html是什么意思？詳解Html的特點、結構、標簽及編輯工具

2023-09-03 07:36:04

Html是什么意思

一、Html是什么意思

Html是Hyper Text Markup Language英文首字母的縮寫，中文翻譯為超文本標記語言, 是一種標記語言。HTML是一種基礎技術，常與CSS、Javascript一起被眾多網(wǎng)站用于設計網(wǎng)頁、網(wǎng)頁應用程序以及移動應用程序的用戶界面。網(wǎng)頁瀏覽器可以讀取HTML文件，并將其渲染成可視化網(wǎng)頁。HTML描述了一個網(wǎng)站的結構語義隨著線索的呈現(xiàn)，使之成為一種標記語言而非編程語言。

HTML元素是構建網(wǎng)站的基石。HTML允許嵌入圖像與對象，并且可以用于創(chuàng)建交互式表單，它被用來結構化信息——例如標題、段落和列表等等，也可用來在一定程度上描述文檔的外觀和語義。HTML的語言形式為尖括號包圍的HTML元素（如<html>），瀏覽器使用HTML標簽和腳本來詮釋網(wǎng)頁內(nèi)容，但不會將它們顯示在頁面上。

HTML可以嵌入如JavaScript的腳本語言，它們會影響HTML網(wǎng)頁的行為。網(wǎng)頁瀏覽器也可以引用層疊樣式表（CSS）來定義文本和其它元素的外觀與布局。維護HTML和CSS標準的組織萬維網(wǎng)聯(lián)盟（W3C）鼓勵人們使用CSS替代一些用于表現(xiàn)的HTML元素。

二、Html的特點

Html包括一系列標簽．通過這些標簽可以將網(wǎng)絡上的文檔格式統(tǒng)一，使分散的Internet資源連接為一個邏輯整體。HTML文本是由HTML命令組成的描述性文本，HTML命令可以說明文字，圖形、動畫、聲音、表格、鏈接等，其主要特點如下：

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

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

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

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

三、Html的結構

標準的超文本標記語言文件都具有一個基本的整體結構，標記一般都是成對出現(xiàn)（部分標記除外例如：<br/>），即超文本標記語言文件的開頭與結尾標志和超文本標記語言的頭部與實體兩大部分。有三個雙標記符用于頁面整體結構的確認。

1、標記符<html>，說明該文件是用超文本標記語言（本標簽的中文全稱）來描述的,它是文件的開頭；而</html>,則表示該文件的結尾，它們是超文本標記語言文件的開始標記和結尾標記。

2、頭部內(nèi)容

<head> </head>這2個標記符分別表示頭部信息的開始和結尾。頭部中包含的標記是頁面的標題、序言、說明等內(nèi)容，它本身不作為內(nèi)容來顯示，但影響網(wǎng)頁顯示的效果。

3、主體內(nèi)容

<body></body>網(wǎng)頁中顯示的實際內(nèi)容均包含在這2個正文標記符之間。正文標記符又稱為實體標記。

下面是一個典型的網(wǎng)頁源碼的結構劃分：

<html> // Html 開始標示

<head> // Html 頭標示

<title>Hello</title> // 設置網(wǎng)頁標題

</head> // 頭結束標示

<body> // 主體開始標示

<p>Hello world!!!</p> // 放置Hello word！?。∥谋?/p>

</body> // 主體結束標示

</html> // Html結束標示

注意：寫完代碼記得將格式保存為.html（推薦）、.htm、.xhtml。

四、Html標簽及作用

標記	類型	譯名或意義	作用	備注
文件標記
<html>	●	文件聲明	讓瀏覽器知道這是 HTML 文件
<head>	●	開頭	提供文件整體資訊
<title>	●	標題	定義文件標題，將顯示于瀏覽頂
<body>	●	本文	設計文件格式及內(nèi)文所在
排版標記
<!--注解-->	○	說明標記	為文件加上說明，但不被顯示
<p>	○	段落標記	為字、畫、表格等之間留一空白行
<br>	○	換行標記	令字、畫、表格等顯示于下一行
<hr>	○	水平線	插入一條水平線
<center>	●	居中	令字、畫、表格等顯示于中間	反對
<pre>	●	預設格式	令文件按照原始碼的排列方式顯示
<div>	●	區(qū)隔標記	設定字、畫、表格等的擺放位置
<nobr>	●	不折行	令文字不因太長而繞行
<wbr>	●	建議折行	預設折行部位
字體標記
<strong>	●	加重語氣	產(chǎn)生字體加粗,bold的效果
<b>	●	粗體標記	產(chǎn)生字體加粗的效果
<em>	●	強調(diào)標記	字體出現(xiàn)斜體效果
<i>	●	斜體標記	字體出現(xiàn)斜體效果
<tt>	●	打字字體	courier字體，字母寬度相同
<u>	●	加上底線	加上底線	反對
<h1>	●	一級標題標記	變粗變大加寬，程度與級數(shù)反比
<h2>	●	二級標題標記	將字體變粗變大加寬
<h3>	●	三級標題標記	將字體變粗變大加寬
<h4>	●	四級標題標記	將字體變粗變大加寬
<h5>	●	五級標題標記	將字體變粗變大加寬
<h6>	●	六級標題標記	將字體變粗變大加寬
<font>	●	字形標記	設定字形、大小、顏色	反對
<basefont>	○	基準字形標記	設定所有字形、大小、顏色	反對
<big>	●	字體加大	令字體稍為加大
<small>	●	字體縮細	令字體稍為縮細
<strike>	●	畫線刪除	為字體加一刪除線	反對
<code>	●	程式碼	字體稍為加寬如<tt>
<kbd>	●	鍵盤字	字體稍為加寬，單一空白
<samp>	●	范例	字體稍為加寬如<tt>
<var>	●	變數(shù)	斜體效果
<cite>	●	傳記引述	斜體效果
<blockquote>	●	引述文字區(qū)塊	縮排字體
<dfn>	●	述語定義	斜體效果
<address>	●	地址標記	斜體效果
<sub>	●	下標字	下標字
<sup>	●	上標字	指數(shù)（平方、立方等）
清單標記
<ol>	●	順序清單	清單項目將以數(shù)字、字母順序排列
<ul>	●	無序清單	清單項目將以圓點排列
<li>	○	清單項目	每一標記標示一項清單項目
<menu>	●	選單清單	清單項目將以圓點排列，如<ul>	反對
<dir>	●	目錄清單	清單項目將以圓點排列，如<ul>	反對
<dl>	●	定義清單	清單分兩層出現(xiàn)
<dt>	○	定義條目	標示該項定義的標題
<dd>	○	定義內(nèi)容	標示定義內(nèi)容
表格標記
<table>	●	表格標記	設定該表格的各項參數(shù)
<caption>	●	表格標題	做成一打通列以填入表格標題
<tr>	●	表格列	設定該表格的列
<td>	●	表格欄	設定該表格的欄
<th>	●	表格標頭	相等于<td>，但其內(nèi)之字體會變粗
表單標記
<form>	●	表單標記	決定單一表單的運作模式
<textarea>	●	文字區(qū)塊	提供文字方盒以輸入較大量文字
<input>	○	輸入標記	決定輸入形式
<select>	●	選擇標記	建立pop-up卷動清單
<option>	○	選項	每一標記標示一個選項
圖形標記
<img>	○	圖形標記	用以插入圖形及設定圖形屬性
連結標記
<a>	●	連結標記	加入連結
<base>	○	基準標記	可將相對url轉(zhuǎn)絕對及指定連結目標
框架標記
<frameset>	●	框架設定	設定框架

五、Html的編輯工具

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

1、基本文本、文檔編輯軟件，使用微軟自帶的記事本或?qū)懽职宥伎梢跃帉?，當然，如果你用WPS或Word來編寫也可以，不過保存時請使用.htm或.html作為擴展名，這樣就方便瀏覽器認出直接解釋執(zhí)行了。

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

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