Adobe Dreamweaver CC網(wǎng)頁(yè)設(shè)計(jì)與制作案例教程

目 錄

第1章 教育培訓(xùn)類網(wǎng)頁(yè)設(shè)計(jì)——文本網(wǎng)頁(yè)的創(chuàng)建與編輯 1
視頻講解：6 個(gè)
1.1 制作月亮寶貝網(wǎng)頁(yè)（一）——打開文本網(wǎng)頁(yè) 2
1.1.1 新建網(wǎng)頁(yè)文檔 3
1.1.2 保存網(wǎng)頁(yè)文檔 3
1.1.3 打開網(wǎng)頁(yè)文檔 4
1.1.4 關(guān)閉網(wǎng)頁(yè)文件 5
1.2 制作月亮寶貝網(wǎng)頁(yè)（二）——頁(yè)面屬性設(shè)置 5
1.2.1 外觀 6
1.2.2 鏈接 6
1.2.3 標(biāo)題 7
1.2.4 標(biāo)題/編碼 7
1.2.5 跟蹤圖像 7
1.3 制作月亮寶貝網(wǎng)頁(yè)（三）——編輯設(shè)置文本屬性 7
1.3.1 插入文本和文本屬性設(shè)置 11
1.3.2 在文本中插入特殊字符 14
1.3.3 使用水平線 15
1.3.4 插入日期 16
1.4 制作新起點(diǎn)圖書館網(wǎng)頁(yè)——格式化文本 17
1.4.1 設(shè)置字體樣式 18
1.4.2 編輯段落 19
1.5 制作小學(xué)網(wǎng)站網(wǎng)頁(yè)設(shè)計(jì)——項(xiàng)目列表 20
1.5.1 認(rèn)識(shí)列表 20
1.5.2 創(chuàng)建項(xiàng)目列表和編號(hào)列表 21
1.5.3 創(chuàng)建嵌套項(xiàng)目 22
1.5.4 項(xiàng)目列表設(shè)置 23
1.6 上機(jī)練習(xí)——制作興德教師招聘網(wǎng)網(wǎng)頁(yè) 23
1.7 思考與練習(xí) 31

第2章 藝術(shù)愛好類網(wǎng)頁(yè)設(shè)計(jì)——表格化網(wǎng)頁(yè)布局 32
視頻講解：4 個(gè)
2.1 制作覓圖網(wǎng)頁(yè)——在單元格中添加內(nèi)容 33
2.1.1 插入表格 39
2.1.2 向表格中輸入文本 40
2.1.3 嵌套表格 41
2.1.4 在單元格中插入圖像 41
2.2 制作工藝品網(wǎng)頁(yè)——表格的基本操作 42
2.2.1　設(shè)置表格屬性 46
2.2.2 選定整個(gè)表格 47
2.2.3 剪切、粘貼表格 48
2.2.4 選擇表格行、列 49
2.2.5 添加行或列 49
2.2.6 刪除行或列 50
2.2.7 選擇一個(gè)單元格 51
2.2.8 合并單元格 51
2.2.9 拆分單元格 52
2.3 制作婚紗攝影網(wǎng)頁(yè)——調(diào)整表格大小 53
2.3.1 調(diào)整整個(gè)表格大小 59
2.3.2 調(diào)整行高或列寬 59
2.3.3 表格排序 60
2.4 上機(jī)練習(xí)——家居網(wǎng)站設(shè)計(jì) 62
2.5 思考與練習(xí) 66

第3章 生活服務(wù)類網(wǎng)頁(yè)設(shè)計(jì)——使用圖像與多媒體美化網(wǎng)頁(yè) 67
視頻講解：5 個(gè)
3.1 制作鮮花網(wǎng)網(wǎng)頁(yè)——在網(wǎng)頁(yè)中添加圖像 68
3.1.1 網(wǎng)頁(yè)圖像格式 72
3.1.2 插入網(wǎng)頁(yè)圖像 73
3.2 制作房地產(chǎn)網(wǎng)頁(yè)——編輯和更新網(wǎng)頁(yè)圖像 74
3.2.1 設(shè)置圖像大小 83
3.2.2 使用Photoshop更新網(wǎng)頁(yè)圖像 84
3.2.3 優(yōu)化圖像 85
3.2.4 裁剪圖像 86
3.2.5 調(diào)整圖像的亮度和對(duì)比度 87
3.2.6 銳化圖像 88
3.3 制作禮品網(wǎng)網(wǎng)頁(yè)——應(yīng)用圖像 89
3.3.1 鼠標(biāo)經(jīng)過(guò)圖像 92
3.3.2 背景圖像 93
3.4 制作裝飾公司網(wǎng)頁(yè)（一）——插入多媒體 94
3.4.1 插入Flash SWF動(dòng)畫 97
3.4.2 插入聲音 98
3.5 上機(jī)練習(xí)——裝飾公司網(wǎng)頁(yè)（二） 100
3.6　思考與練習(xí) 105

第4章 電腦網(wǎng)絡(luò)類網(wǎng)頁(yè)設(shè)計(jì)——鏈接的創(chuàng)建 106
視頻講解：3 個(gè)
4.1 制作IT信息網(wǎng)頁(yè)——?jiǎng)?chuàng)建簡(jiǎn)單鏈接 107
4.1.1 使用【屬性】面板創(chuàng)建鏈接 111
4.1.2 使用【指向文件】圖標(biāo)創(chuàng)建鏈接 112
4.1.3 使用快捷菜單創(chuàng)建鏈接 112
4.2 制作大眾信息站網(wǎng)頁(yè)——?jiǎng)?chuàng)建其他鏈接 112
4.2.1 創(chuàng)建錨記鏈接 122
4.2.2 創(chuàng)建E-mail鏈接 123
4.2.3 創(chuàng)建下載鏈接 124
4.2.4 創(chuàng)建空鏈接 125
4.2.5 創(chuàng)建熱點(diǎn)鏈接 126
4.3 上機(jī)練習(xí)——制作綠色軟件網(wǎng)頁(yè) 127
4.4　思考與練習(xí) 132

第5章 旅游交通類網(wǎng)頁(yè)設(shè)計(jì)——使用CSS樣式修飾頁(yè)面 133
視頻講解：5 個(gè)
5.1 制作天氣預(yù)報(bào)網(wǎng)頁(yè)——初識(shí)CSS 134
5.1.1 CSS基礎(chǔ) 136
5.1.2 【CSS 設(shè)計(jì)器】面板 136
5.2 制作旅游網(wǎng)站（一）——定義CSS樣式的屬性 137
5.2.1 創(chuàng)建CSS樣式 139
5.2.2 類型屬性 140
5.2.3 背景樣式的定義 142
5.2.4 區(qū)塊樣式的定義 143
5.2.5 方框樣式的定義 144
5.2.6 邊框樣式的定義 146
5.2.7 列表樣式的定義 146
5.2.8 定位樣式的定義 147
5.2.9 擴(kuò)展樣式的定義 148
5.2.10 創(chuàng)建嵌入式CSS樣式 149
5.2.11 鏈接外部樣式表 150
5.3 制作旅游網(wǎng)站（二）——編輯CSS樣式 151
5.3.1 修改CSS樣式 158
5.3.2 刪除CSS樣式 159
5.3.3 復(fù)制CSS樣式 159
5.4 制作旅游網(wǎng)站（三）——使用CSS過(guò)濾器 160
5.4.1 Alpha濾鏡 166
5.4.2 Blur濾鏡 167
5.4.3 FlipH濾鏡 168
5.4.4 Glow濾鏡 169
5.4.5 Gray濾鏡 170
5.4.6 Invert濾鏡 172
5.4.7 Shadow濾鏡 173
5.4.8 Wave濾鏡 174
5.4.9 Xray濾鏡 175
5.5 上機(jī)練習(xí)——制作路暢網(wǎng)網(wǎng)頁(yè) 176
5.6 思考與練習(xí) 193

第6章 娛樂(lè)休閑類網(wǎng)頁(yè)設(shè)計(jì)——使用行為制作特效網(wǎng)頁(yè) 194
視頻講解：3 個(gè)
6.1 制作游戲網(wǎng)頁(yè)——行為的概念 195
6.1.1 【行為】面板 201
6.1.2 在【行為】面板中添加行為 201
6.2 制作籃球網(wǎng)頁(yè)——內(nèi)置行為 202
6.2.1 交換圖像 212
6.2.2 彈出信息 213
6.2.3 恢復(fù)交換圖像 214
6.2.4 打開瀏覽器窗口 215
6.2.5 拖動(dòng)AP元素 216
6.2.6 改變屬性 217
6.2.7 效果 218
6.2.8 顯示-隱藏元素 218
6.2.9 檢查插件 219
6.2.10 設(shè)置文本 220
6.2.11 跳轉(zhuǎn)菜單 222
6.2.12 轉(zhuǎn)到URL 223
6.3 上機(jī)練習(xí)——民謠音樂(lè)網(wǎng)頁(yè) 224
6.4 思考與練習(xí) 231

第7章 商業(yè)經(jīng)濟(jì)類網(wǎng)頁(yè)設(shè)計(jì)——使用表單創(chuàng)建交互網(wǎng)頁(yè) 232
視頻講解：3 個(gè)
7.1 制作宏達(dá)物流網(wǎng)頁(yè)——表單對(duì)象的創(chuàng)建 233
7.1.1 創(chuàng)建表單域 239
7.1.2 插入文本域 240
7.1.3 多行文本域 242
7.1.4 復(fù)選框 243
7.1.5 單選按鈕 244
7.1.6 列表/菜單 245
7.2 制作優(yōu)選易購(gòu)網(wǎng)頁(yè)——使用按鈕激活表單 247
7.2.1 插入按鈕 254
7.2.2 圖像按鈕 255
7.3 上機(jī)練習(xí)——制作美食網(wǎng)頁(yè) 257
7.4　思考與練習(xí) 262
附錄1 Dreamweaver CC 常用快捷鍵 263
附錄2 參考答案 265