Adobe Dreamweaver CC課堂實(shí)錄（Div+CSS+HTML5）

第1章  網(wǎng)頁(yè)設(shè)計(jì)入門學(xué)習(xí)
1.1 網(wǎng)頁(yè)的基本概念 2
1.1.1 網(wǎng)頁(yè)與網(wǎng)站 2
1.1.2 靜態(tài)網(wǎng)頁(yè)與動(dòng)態(tài)網(wǎng)頁(yè) 2
1.2 網(wǎng)站制作流程 4
1.2.1 網(wǎng)站策劃 4
1.2.2 網(wǎng)站設(shè)計(jì) 5
1.2.3 網(wǎng)頁(yè)制作 6
1.2.4 測(cè)試和發(fā)布網(wǎng)站 6
1.2.5 網(wǎng)站維護(hù) 7
1.3 網(wǎng)頁(yè)布局與配色 7
1.3.1 網(wǎng)頁(yè)的布局類型 7
1.3.2 網(wǎng)頁(yè)色彩基礎(chǔ) 11
1.3.3 色彩搭配原則 12
1.4 網(wǎng)頁(yè)設(shè)計(jì)常用工具 17
1.5 課后練習(xí) 18
第2章  Dreamweaver基礎(chǔ)操作
2.1 Dreamweaver 的工作界面 20
2.1.1 啟動(dòng)Dreamweaver  20
2.1.2 自定義軟件界面 20
實(shí)例：設(shè)置主瀏覽器 22
2.1.3 Dreamweaver的視圖模式 23
2.2 站點(diǎn)的創(chuàng)建與管理 23
2.2.1 創(chuàng)建站點(diǎn) 24
實(shí)例：創(chuàng)建遠(yuǎn)程站點(diǎn) 25
2.2.2 編輯站點(diǎn) 26
2.2.3 導(dǎo)入和導(dǎo)出站點(diǎn) 28
2.2.4 新建文件或文件夾 28
2.2.5 編輯文件或文件夾 29
2.3 文檔的基礎(chǔ)操作 29
2.3.1 新建文檔 29
2.3.2 保存文檔 29
2.3.3 打開文檔 30
2.3.4 插入文檔 30
2.3.5 關(guān)閉文檔 31
2.4 課堂實(shí)戰(zhàn)：創(chuàng)建我的站點(diǎn) 31
2.5 課后練習(xí) 33
第3章  HTML基礎(chǔ)
3.1 認(rèn)識(shí)HTML 36
3.1.1 HTML簡(jiǎn)介 36
3.1.2 HTML的基本結(jié)構(gòu) 36
3.1.3 文件開始標(biāo)簽 37
3.1.4 文件頭部標(biāo)簽 37
3.1.5 標(biāo)題標(biāo)簽 37
3.1.6 主體標(biāo)簽 38
3.1.7 元信息標(biāo)簽 38
3.1.8 標(biāo)簽 38
3.2 HTML的基本標(biāo)簽 38
3.2.1 標(biāo)題文字 38
3.2.2 文字字體 39
實(shí)例：使用HTML在網(wǎng)頁(yè)中添加文本 40
3.2.3 段落換行 40
3.2.4 不換行標(biāo)簽 41
3.2.5 圖像標(biāo)簽 42
實(shí)例：插入網(wǎng)頁(yè)圖像 43
3.2.6 超鏈接標(biāo)簽 43
3.2.7 列表標(biāo)簽 45
3.2.8 表格標(biāo)簽 47
3.2.9 表單標(biāo)簽 49
3.3 HTML 5簡(jiǎn)介 50
3.3.1 HTML 5的語法變化 50
3.3.2 HTML 5中的標(biāo)記方法 50
3.3.3 HTML 5中新增加的元素 51
3.3.4 HTML 5中新增加的屬性元素 55
3.4 課堂實(shí)戰(zhàn):制作簡(jiǎn)單的網(wǎng)頁(yè)布局 59
3.5 課后練習(xí) 62
第4章  文本的應(yīng)用
4.1 創(chuàng)建文本 66
4.1.1 直接輸入文本 66
4.1.2 通過“導(dǎo)入”命令導(dǎo)入文本 66
實(shí)例：制作古詩(shī)文網(wǎng)頁(yè) 67
4.2 設(shè)置網(wǎng)頁(yè)中的文本屬性 68
4.2.1 “屬性”面板 69
4.2.2 設(shè)置文本格式 69
實(shí)例：添加文字字體 71
4.2.3 設(shè)置段落格式 73
4.2.4 設(shè)置文本樣式 74
4.2.5 使用段落列表 75
4.3 在網(wǎng)頁(yè)中插入特殊元素 75
4.3.1 插入特殊符號(hào) 75
4.3.2 插入水平線 76
4.4 課堂實(shí)戰(zhàn)：制作文字標(biāo)簽 76
4.5 課后練習(xí) 79
第5章  圖像元素的應(yīng)用
5.1 在網(wǎng)頁(yè)中插入圖像 82
5.1.1 網(wǎng)頁(yè)中圖像的常見格式 82
5.1.2 插入圖像 83
5.1.3 圖像的屬性設(shè)置 83
5.1.4 圖像的對(duì)齊方式 85
5.1.5 運(yùn)用HTML代碼設(shè)置圖像屬性 86
實(shí)例：為文檔添加圖像 86
5.1.6 設(shè)置網(wǎng)頁(yè)背景圖像 88
實(shí)例：添加網(wǎng)頁(yè)背景 88
5.1.7 鼠標(biāo)經(jīng)過圖像 90
實(shí)例 制作鼠標(biāo)經(jīng)過圖像效果 90
5.2 編輯圖像 91
5.2.1 裁剪圖像 91
5.2.2 調(diào)整圖像的亮度和對(duì)比度 92
5.2.3 銳化圖像 92
5.3 課堂實(shí)戰(zhàn)：制作鼠標(biāo)經(jīng)過圖像效果 93
5.4 課后練習(xí) 95
第6章  超鏈接的應(yīng)用
6.1 超級(jí)鏈接的概念 98
6.1.1 相對(duì)路徑 98
6.1.2 路徑 98
6.2 管理網(wǎng)頁(yè)超鏈接 98
6.2.1 自動(dòng)更新鏈接 98
6.2.2 檢查站點(diǎn)中的鏈接錯(cuò)誤 99
6.3 在文本中應(yīng)用鏈接 99
6.3.1 文本鏈接 99
實(shí)例：制作電子郵件鏈接 101
6.3.2 下載鏈接 101
實(shí)例：下載電子文檔 102
6.4 在圖像中應(yīng)用鏈接 103
6.4.1 圖像鏈接 103
6.4.2 圖像熱點(diǎn)鏈接 103
6.5 課堂實(shí)戰(zhàn)：制作書店網(wǎng)頁(yè) 103
6.6 課后練習(xí) 105
第7章  表格的應(yīng)用
7.1 插入表格 108
7.1.1 與表格有關(guān)的術(shù)語 108
7.1.2 插入表格 108
7.1.3 表格的基本代碼 109
實(shí)例：制作活動(dòng)信息表 109
7.2 表格屬性 112
7.2.1 設(shè)置表格屬性 112
7.2.2 設(shè)置單元格屬性 112
7.2.3 鼠標(biāo)經(jīng)過顏色 113
7.2.4 表格的屬性代碼 114
實(shí)例：添加表格背景 116
7.3 選擇表格 117
7.3.1 選擇整個(gè)表格 117
7.3.2 選擇一個(gè)單元格 117
7.4 編輯表格 118
7.4.1 拷貝和粘貼表格 118
7.4.2 添加行和列 119
7.4.3 刪除行和列 120
7.4.4 合并或拆分單元格 120
7.5 課堂實(shí)戰(zhàn)：制作西餐廳網(wǎng)頁(yè) 121
7.6 課后練習(xí) 123
第8章  CSS網(wǎng)頁(yè)美化技術(shù)
8.1 CSS概述 126
8.1.1 CSS的特點(diǎn) 126
8.1.2 CSS的定義 126
8.2 創(chuàng)建CSS樣式 129
8.2.1 CSS設(shè)計(jì)器 129
8.2.2 創(chuàng)建CSS樣式 129
實(shí)例：添加圖片邊框 132
8.3 CSS的設(shè)置 134
8.3.1 類型 134
8.3.2 背景 135
8.3.3 區(qū)塊 135
8.3.4 方框 136
8.3.5 邊框 137
8.3.6 列表 137
8.3.7 定位 138
8.3.8 擴(kuò)展 138
8.3.9 過渡 139
實(shí)例：創(chuàng)建內(nèi)部樣式表 139
8.4 課堂實(shí)戰(zhàn)：制作花店網(wǎng)頁(yè) 141
8.5 課后練習(xí) 145
第9章  Div CSS網(wǎng)頁(yè)布局技術(shù)
9.1 CSS與Div布局基礎(chǔ) 148
9.1.1 什么是Web標(biāo)準(zhǔn) 148
9.1.2 Div概述 148
9.1.3 創(chuàng)建Div 149
9.2 CSS布局方法 150
9.2.1 盒子模型 150
9.2.2 外邊距設(shè)置 151
實(shí)例：設(shè)置矩形邊距 152
9.2.3 外邊距合并 155
實(shí)例：避免外邊距合并 157
9.2.4 內(nèi)邊距設(shè)置 158
9.3 課堂實(shí)戰(zhàn)：制作幼兒園網(wǎng)頁(yè) 159
9.4 課后練習(xí) 167
第10章  模板和庫(kù)
10.1 創(chuàng)建模板 170
10.1.1 直接創(chuàng)建模板 170
10.1.2 從現(xiàn)有網(wǎng)頁(yè)中創(chuàng)建模板 170
10.1.3 創(chuàng)建可編輯區(qū)域 171
實(shí)例：創(chuàng)建網(wǎng)頁(yè)模板 172
10.2 管理和使用模板 174
10.2.1 應(yīng)用模板 174
10.2.2 從模板中分離 175
10.2.3 更新模板及模板內(nèi)容頁(yè) 175
10.2.4 創(chuàng)建嵌套模板 175
10.2.5 創(chuàng)建可選區(qū)域 176
10.3 創(chuàng)建和使用庫(kù) 176
10.3.1 創(chuàng)建庫(kù)項(xiàng)目 177
實(shí)例：新建庫(kù)項(xiàng)目 177
10.3.2 插入庫(kù)項(xiàng)目 178
10.3.3 編輯和更新庫(kù)項(xiàng)目 179
10.4 課堂實(shí)戰(zhàn)：制作旅行社網(wǎng)頁(yè) 180
10.5 課后作業(yè) 183
第11章  表單的應(yīng)用
11.1 使用表單 186
11.1.1 認(rèn)識(shí)表單 186
11.1.2 基本表單元素 186
11.2 文本類表單 187
11.2.1 文本 187
11.2.2 密碼 188
11.2.3 文本區(qū)域 189
實(shí)例：制作登錄界面 189
11.3 單選按鈕和復(fù)選框表單 191
11.3.1 單選按鈕和單選按鈕組 191
11.3.3 復(fù)選框和復(fù)選框組 192
實(shí)例：制作問答網(wǎng)頁(yè) 193
11.4 其他常用表單 196
11.4.1 “提交”和“重置”按鈕 196
11.4.2 文件 196
11.4.3 選擇 196
11.5 課堂實(shí)戰(zhàn)：制作讀書網(wǎng)站網(wǎng)頁(yè) 197
11.6 課后作業(yè) 203
第12章  行為的應(yīng)用
12.1 什么是行為 206
12.1.1 行為 206
12.1.2 事件 207
12.1.3 常見事件的使用 207
12.2 利用行為調(diào)節(jié)瀏覽器窗口 208
12.2.1 調(diào)用JavaScript 208
12.2.2 轉(zhuǎn)到URL 208
12.2.3 打開瀏覽器窗口 209
12.3 利用行為制作圖像特效 210
12.3.1 交換圖像與恢復(fù)交換圖像 210
實(shí)例：制作圖像交換效果 211
12.3.2 預(yù)先載入圖像 212
12.4 利用行為顯示文本 213
12.4.1 彈出信息 213
實(shí)例：制作網(wǎng)頁(yè)彈出信息 213
12.4.2 設(shè)置狀態(tài)欄文本 214
12.4.3 設(shè)置容器的文本 214
12.4.4 設(shè)置文本域文字 215
12.5 利用行為控制表單 215
12.5.1 跳轉(zhuǎn)菜單 215
12.5.2 檢查表單 216
12.6 課堂實(shí)戰(zhàn)：美化寵物網(wǎng)站首頁(yè) 217
12.7 課后作業(yè) 219
第13章  制作動(dòng)物園網(wǎng)頁(yè)
13.1 項(xiàng)目背景及需求 222
13.1.1 項(xiàng)目背景 222
13.1.2 設(shè)計(jì)要求 222
13.2 項(xiàng)目制作 222
13.2.1 項(xiàng)目分析 223
13.2.2 制作步驟 224