站長資訊網(wǎng)
html文件的擴(kuò)展名有兩種：“html”和“htm”。html文件是一種純文本文件，是由HTML命令組成的描述性文本，是一種靜態(tài)的網(wǎng)頁文件；HTML文件在編輯時只能寫入純文本，無法像“.doc”文檔那樣直接為文字內(nèi)容設(shè)置樣式。
前端（vue）入門到精通課程：進(jìn)入學(xué)習(xí)
本教程操作環(huán)境：windows7系統(tǒng)、HTML5版、Dell G3電腦。
HTML 英文全稱是 Hyper Text Markup Language，中文譯為“超文本標(biāo)記語言”，專門用來設(shè)計和編輯網(wǎng)頁。
使用 HTML 編寫的文件稱為“HTML 文檔”，一般后綴為.html（也可以使用.htm，不過比較少見）。HTML 文檔是一種純文本文件，您可以使用 Windows 記事本、Linux Vim、Notepad++、Sublime Text、VS Code 等文本編輯來打開或者創(chuàng)建。
HTML 文檔 = 網(wǎng)頁
-
HTML 文檔描述網(wǎng)頁。
-
HTML 文檔也被稱之為網(wǎng)頁。
-
HTML 文檔包含了 HTML 標(biāo)簽和純文本。
HTML標(biāo)簽：
HTML 是一種標(biāo)記語言，使用各種標(biāo)簽來格式化內(nèi)容，標(biāo)簽的特點(diǎn)如下所示：
-
HTML 標(biāo)簽由尖括號包圍的關(guān)鍵詞構(gòu)成，比如 <html>；
-
除了少數(shù)標(biāo)簽外，大多數(shù) HTML 標(biāo)簽都是成對出現(xiàn)的，比如 <b> 和 </b>；
-
成對出現(xiàn)的標(biāo)簽中，第一個標(biāo)簽稱為開始標(biāo)簽，第二個標(biāo)簽稱為結(jié)束標(biāo)簽（閉合標(biāo)簽）。
HTML 中的不同標(biāo)簽具有不同的含義，學(xué)習(xí) HTML 其實(shí)就是學(xué)習(xí)各個標(biāo)簽的含義，根據(jù)實(shí)際場景的需要，選擇合適的標(biāo)簽，從而制作出精美的網(wǎng)頁。
瀏覽器相對于HTML文檔的作用:
- Web 瀏覽器的作用是讀取 HTML 文檔，并以網(wǎng)頁的形式去顯示出內(nèi)容。
-
Web 瀏覽器不會顯示 HTML 標(biāo)簽，而是使用標(biāo)簽來解釋頁面里的內(nèi)容。
HTML 標(biāo)簽代碼如下:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>第一個網(wǎng)頁</title> </head> <body> <h1>這是我的第一個網(wǎng)頁</h1> <p>我一定會成為一名優(yōu)秀的前端開發(fā)工程師。</p> </body> </html>
本例標(biāo)簽代碼解釋:
1、網(wǎng)頁的描述需寫在 <html></html> 標(biāo)簽中。
2、標(biāo)題、字符編碼、兼容性、關(guān)鍵字、描述等信息需寫在 <head></head> 標(biāo)簽中。
3、網(wǎng)頁需要展示的內(nèi)容需寫在 <body></body> 標(biāo)簽中。
某些時候不按標(biāo)準(zhǔn)書寫代碼雖然可以正常顯示，但是作為職業(yè)素養(yǎng)，還是一定要養(yǎng)成正規(guī)的編寫習(xí)慣。
<!DOCTYPE html>文檔聲明頭.告知瀏覽器是使用哪種html版本進(jìn)行編寫(這里是HTML5).<html lang="en">向搜索引擎表示該頁面是html語言，并且語言為英文.<h1></h1>標(biāo)題標(biāo)簽. 為其中的文本內(nèi)容增加了作為標(biāo)題的語義.<p></p>段落標(biāo)簽. 為其中的文本內(nèi)容增加了作為段落的語義.
編輯器運(yùn)行此段代碼，Web 瀏覽器就會編譯 HTML 標(biāo)簽代碼，以標(biāo)簽來解釋頁面里的內(nèi)容。
最終的運(yùn)行結(jié)果便是展示出頁面里的內(nèi)容，不會顯示 HTML 標(biāo)簽。
Web 瀏覽器展示效果如下:
OK 我們再來認(rèn)識下什么是"純文本"文件:
- Windows 中自帶一個軟件，叫做記事本。
記事本保存的文檔格式是 .txt 格式，就是英語text的縮寫。
術(shù)語上，稱呼這個文件叫做:“ 純文本文件 ”。
非純文本文件和純文本文件的含義與區(qū)別:
- ** .doc 非純文本文件:**
我們做一個小實(shí)驗，打開我們的 word 軟件，寫一個文檔再進(jìn)行保存，發(fā)現(xiàn)保存后的文檔后綴名格式是 .doc 。 另外我們在寫的過程中還發(fā)現(xiàn) .doc 這個格式的文件它還能夠設(shè)置以及保存文本的樣式，比如文本有藍(lán)色的、橙色的，還可以為文本設(shè)置下劃線等等繁多的樣式。
- ** .txt 純文本文件:**
現(xiàn)在我們再打開 Windows 自帶的記事本并進(jìn)行寫作，我們發(fā)現(xiàn)在寫作的過程中是不能為文本設(shè)置顏色、不能為文本設(shè)置下劃線等樣式的。
總結(jié)非純文本文件和純文本文件的 含義 與 區(qū)別:
含義:
- 非純文本文件(比如.doc):
它除了有文本，還可以為文本設(shè)置花樣繁多的樣式。 - 純文本文件(比如.txt):
它只有文本，沒有樣式。
區(qū)別:
- 非純文本文件(比如.doc):
它除了有純文本那樣可寫入文本的基本功能，并且還能夠設(shè)置以及保存文本的樣式，比如將文本設(shè)置保存為不同的文本顏色，為文本設(shè)置下劃線等等繁多的樣式。 - 純文本文件(比如.txt):
一句話概括就是它只能規(guī)規(guī)矩矩老老實(shí)實(shí)工工整整的寫入文本，不能夠為文本設(shè)置任何樣式。
注:當(dāng) .doc 和 .txt 存儲著同樣的內(nèi)容時，.doc 比 .txt 要大(因為含有樣式)。
為什么這里會先說明下非純文本文件和純文本文件的含義與區(qū)別呢?
-
因為:
HTML 就是純文本!
HTML 文件在編輯時只能寫入純文本, 你會發(fā)現(xiàn)它無法像 .doc 文檔那樣直接為文字內(nèi)容做樣式!
我們可以做個小實(shí)驗, 也是應(yīng)驗HTML是純文本文件的最經(jīng)典實(shí)驗:
我們在電腦桌面上新建一個記事本 .txt 文件. 打開并隨意寫上文字內(nèi)容后 Ctrl+S 保存, 然后關(guān)閉文件。
下一步我們強(qiáng)行將文件的 .txt 拓展名改為 .html 拓展名. 此時這個 .html 文件它便是一個網(wǎng)頁文件
這時我們使用瀏覽器去打開它, 我們發(fā)現(xiàn)瀏覽器是完全可以正常顯示原有的全部內(nèi)容的!
這樣開始從一個 .txt 文件修改為了 .html 文件, 直至最后使用瀏覽器運(yùn)行, 發(fā)現(xiàn)也是會正常顯示全部內(nèi)容的過程, 足以證明 HTML 是純文本文件!
另外我們也是完全可以使用記事本去編寫 HTML 文件, 因為 HTML 文件完全就是純文本文件(但實(shí)際開發(fā)中沒人這么干, 這里只是說明下罷了)。
