1、使用HTML製作個人網頁,柴惠敏 台灣大學 物理治療學系,網頁與網站,網頁(page): 首頁(home page) 以notepad撰寫HTML程式語言或以FrontPage軟體直接編寫 網站(web site):由許多網頁組成有內容的主題 瀏覽器(browser):觀賞網頁的軟體 IE (Internet Explorer)或NetScape,何謂 HTML？,全名為 “Hyper Text MarkUp Language”，即超文件標記語言 是一種標記描述語言，介 於網頁排版與幕後排版之間的一種語言，是最簡單的網頁編輯語言 本課程將介紹以簡單基本的 HTML 編輯程式 ，可以真正地了解
2、HTML 的基本語法與基本架構,使用HTML撰寫網頁的步驟,撰寫網頁：在NotePad或FrontPage內，撰寫HTML程式語言 觀賞網頁：將寫好的程式以 .htm或 .html的副檔名儲存後，即可以瀏覽器中觀賞 修改網頁：開啟檢視中的原始檔修改、儲存，再按重新整理後，即可重新瀏覽,製作個人網頁,基本語法 基本語法結構 整體表現的設定 顏色值表 文章排版 清單設計 表格、圖形、多媒體、走馬燈 框架,基本語法結構, (網頁的標題) (指令及內容區)這是我第一個網頁,整體表現的設定, 顏色值的輸入請參見顏色值表,顏色值表,# FF0000 紅色 # FF00FF 洋紅色 # FF6600 朱色
3、# FFAAAA 粉紅色 # FF8800 橙黃色 # FFFF00 黃色 # 00FF00 鮮綠色 # 00AA00 綠色 #88CCFF 淺藍色 # 55CCFF 水藍色,# 008080 藍綠色 # 0000FF 藍色 # 800080 紫色 # C00080 紫紅色 # 7700FF 紫藍色 # 808080 深灰色 # C0C0C0 淺灰色 # 805000 褐色 # FFFFFF 白色 # 000000 黑色,顏色值表-黃綠色系,淺綠色 # 004000 鮮綠色 #海藻綠色 # 00AA00 綠色 #004000墨綠色 橄欖綠色 # 黃綠色 #008000綠色,# 淺黃色 # FF
4、FF00 黃色 #FFAA00金黃色 # 深黃色,顏色值表藍紫色系,#88CCFF 淺藍色 水藍色 青色 # 008080 藍綠色 深藍綠色 深藍色 # 0000FF藍色天藍色 冰藍色,# 800080 紫色 # C00080 紫紅色 # 7700FF 紫藍色 # 808080 深灰色 # C0C0C0 淺灰色 # 805000 褐色 # FFFFFF 白色 # 000000 黑色,製作個人網頁,基本語法 文章排版 文章段落的設定 標題文字的設定 一般字型的設定 其他字型的變化 樣式指令 清單設計 表格、圖形、多媒體、走馬燈 框架,文章段落的設定,強迫分行 關閉分行 . 分段 . 原始文字樣式
5、 置中對齊 . 插入直線,分段語法, 分段的例子,標題文字的設定, 說明： hn：標題文字的字體大小，n以數字 1-6表示， 1 最大而 6示最小，且字體加粗 六種標題文字,基本文字的設定, 說明： SIZE：字體大小，以數字 1-7表示 ，7最大而 1 最小 FACE：字體型式，如：標楷體、新細明體、Time New Roman 、Arial等。,其他字型的變化,粗體 斜體. 底線 刪除線 文字下標 文字上標 大一號字. 小一號字. ,插入水平線, 說明: 分隔段落用 通常與書籤超連結併用,網頁指定語言格式,. 說明 網頁的文字設定顯示，與瀏覽者的電腦文字格式有關，故儘量減少使用罕見字型 以
6、Netscape瀏覽時，無論設定為何，中文會是以細明體顯示。若是加上上述指令，則可正確顯示,特殊字元,space = “,樣式指令,說明 可置於或或文字間,製作個人網頁,基本語法 文章排版 清單、表格、圖案設計 圖形、多媒體、走馬燈 框架,選項清單設計, 項目一項目二項目三 ,標號清單設計,項目一項目二項目三 ,表格之基本格式,表格說明 . 定義標題 . 定義列 . 定義儲存格 . 寫法:表格說明. 標題列標題內容 第二列儲存格內容 第三列儲存格內容 ,表格設計, 說明： 1.BORDER：意為表格邊線。 2.WIDTH：意為表格寬度。 3.BGCOLOR：意為表格底色，其中-要使用 0-9
7、及 A-F 來表示，顏色值的輸入請參見顏色值表。 4.CELLSPACING：意為表格框線。,定義標題,內容語法如下： 說明： 1.ALIGN：意為內容位置，而 #= LEFT / CENTER / RIGHT 選擇其中一個即可。 2.BGCOLOR：意為此格底色，其中-要使用 0-9 及 A-F 來表示，顏色值的輸入請參見顏色值表。,儲存格的用法, 說明： ALIGN：為內容位置 BGCOLOR：為此格底色顏色值參見顏色值表 COLSPAN：為合併行數，無法和rawspan 合用 ROWSPAN：為合併列數，無法和colspan 合用,製作個人網頁,基本語法 文字排版 清單設計 表格、圖形、多媒體、走馬燈 框架,插入圖形,插入走馬燈, ,內容語法如下： 說明： 1.HREF：意為鏈結目標，如： 、 等。 2.TARGET：意為目標框位，時常與定義框架來使用 ，因敘述不易，故可以 下載範例 (ZIP格式) 來參 考，可見框架建立之說明。,您停留本站時間,
