大家都上過網瀏覽過網頁，可能對于大部分同學來說，并不知道網頁是怎樣產生的。本文將對HTML 進行簡單的了解。
HTML是什么？
HTML 是用來描述網頁的一種語言。
- HTML 指的是超文本標記語言 (Hyper Text Markup Language)
- HTML 不是一種編程語言，而是一種標記語言 (markup language)
- 標記語言是一套標記標簽 (markup tag)
- HTML 使用標記標簽來描述網頁
所以這里你將學習一種所謂新的 "語言"，去描述HTML頁面，然后展示給大家看。
HTML 標簽
HTML 標記標簽通常被稱為 HTML 標簽 (HTML tag)。
- HTML 標簽是由尖括號包圍的關鍵詞，比如 <html>
- HTML 標簽通常是成對出現的，比如 <b> 和 </b>
- 標簽對中的第一個標簽是開始標簽，第二個標簽是結束標簽
- 開始和結束標簽也被稱為開放標簽和閉合標簽
也有幾個特例的
- <br /> 表示斷行 來自單詞 break
- <hr /> 表示水平線 來自單詞 horizontal ruler
- <img /> 表示插入一個圖片 來自單詞 image
HTML 基本結構
演示效果
由這兩個圖可以看出 代碼和效果的對比。
首先聲明 html 文檔，
然后設置 頭部 的信息，比如 title。標簽頁上的文字 'UIC Student' 是寫在 標簽 <title> 內。
具體內容展示，寫在 <body> 內。比如 文字，圖片。
注意標簽如果是成對的，注意閉合標簽。
建議：
- 書寫html代碼時候，成對標簽的先將 開始標簽 閉合標簽都先寫了，然后再在里面書寫具體內容，避免遺忘。
- 注意html代碼縮進，書寫起來美觀，容易檢查。
學習基本標簽
headings
headings 總共有 6 個，
<h1> <h2> <h3> <h4> <h5> <h6>
示例代碼：
示例效果：
<p>標簽表示一個段落。
示例代碼：
示例效果：
<a>超鏈接
鏈接是通過標簽 <a> 來定義的.
示例代碼：
示例效果：
href 表示 要鏈接的目標地址。
title 表示 當鼠標移動到鏈接的文字上面時候，鼠標右下角會提示顯示UIC的文字。
target="_blank" 表示點擊之后，鏈接從瀏覽器打開新的一個標簽頁顯示內容； 如果不加 target 這個屬性， 點擊鏈接將會在原來的標簽頁打開跳轉頁面的內容。
以上 href, title, target 這些我們稱之為 屬性。用戶對 <a>標簽的額外設置。
<img> 插入圖片
示例代碼：
示例效果：
src 設置需要引入圖片資源。而且圖片放于與代碼同一個目錄下。
width 設置圖片寬度。
height 設置圖片高度。
HTML 的標簽其實還有很多，這里無法一一列舉。
建議大家前往 W3School 中去了解。
編寫步驟
- 編寫HTML代碼
- 本地預覽頁面效果
- 本地部署到服務器
- 在線查看頁面
編寫代碼
編寫代碼可以用 Notepad++, Sublime Text3等工具，初學者不建議用Dreamweaver。
本地預覽頁面
這兩個頁面地址欄上顯示的是本電腦下的路徑。
上傳到服務器
打開FileZilla軟件
Host: stuweb.uic.edu.hk -- 遠程服務器地址
Username: b630300007 -- 學生學號
Password: ****** -- 學生密碼（與郵箱密碼一致）
登錄成功之后的界面：
左邊紅色部分是你當前電腦，找到你存放你html文件的地方,上面是路徑，下面是指定文件夾下的文件列表。
右邊藍色部分是遠程服務器， / 表示根目錄， 在根目錄下選擇 public_html的文件夾，我們馬上就要將本地的html文件傳輸到服務器上。
選擇你要上傳的文件，郵件鼠標，上傳。
上傳很快，你就看到如下的結果。
在線查看
在瀏覽器上輸入地址：
http://stuweb.uic.edu.hk/hejing/index.html
注意：這里的 hejing 請根據各自的學號替換。
如果你需要打開其他的頁面，比如 tags.html
瀏覽器上輸入地址：
http://stuweb.uic.edu.hk/hejing/tags.html
如果你嘗試打開一個不存在的html頁面將出現Not Found錯誤。
比如： http://stuweb.uic.edu.hk/hejing/uic.html
如果有疑問，請在公眾號留言，本團隊將定期收集反饋，統一回復。
本文完。
