Dreamweaver CC 2018中文版入門(mén)與提高

目 錄
第 1 章 初識(shí) Dreamweaver CC 2018 001
1.1 認(rèn)識(shí) Dreamweaver CC 2018 002
1.1.1 安裝 Dreamweaver CC 2018 002
1.1.2 卸載 Dreamweaver CC 2018 004
1.1.3 啟動(dòng)與退出 .004
1.2 Dreamweaver CC 2018 的工作界面 006
1.2.1 菜單欄 007
1.2.2 文檔工具欄 .009
1.2.3 通用工具欄 .009
1.2.4 文檔窗口 010
1.2.5 狀態(tài)欄 012
1.2.6 浮動(dòng)面板組 .014
1.2.7 上機(jī)練習(xí)——組合、拆分浮動(dòng)面板組 .016
1.3 網(wǎng)頁(yè)的基本操作 .017
1.3.1 上機(jī)練習(xí)——創(chuàng)建一個(gè) HTML 頁(yè)面 017
1.3.2 保存網(wǎng)頁(yè) 018
1.3.3 上機(jī)練習(xí)——打開(kāi)已有的網(wǎng)頁(yè) .019
1.4 設(shè)置頁(yè)面屬性 .019
1.4.1 設(shè)置頁(yè)面外觀 .020
1.4.2 設(shè)置頁(yè)面鏈接樣式 .022
1.4.3 設(shè)置標(biāo)題屬性 .022
1.4.4 設(shè)置頁(yè)面標(biāo)題和編碼 .023
1.4.5 上機(jī)練習(xí)——設(shè)置網(wǎng)頁(yè)外觀 .023
1.5 答疑解惑 .024
1.6 學(xué)習(xí)效果自測(cè) .024
第 2 章 站點(diǎn)構(gòu)建與管理 026
2.1 創(chuàng)建本地站點(diǎn) .027
2.1.1 建立站點(diǎn) 027
2.1.2 上機(jī)練習(xí)——創(chuàng)建“美食天下”網(wǎng)站 .031
2.2 管理站點(diǎn) .033
2.2.1 切換站點(diǎn) 033
2.2.2 上機(jī)練習(xí)——編輯“美食天下”站點(diǎn) .034
2.2.3 添加站點(diǎn) 035
目 錄
IV Dreamweaver CC 2018
中文版入門(mén)與提高
IV Dreamweaver CC 2018
中文版入門(mén)與提高
2.2.4 刪除站點(diǎn) 035
2.2.5 導(dǎo)入、導(dǎo)出站點(diǎn) .035
2.3 管理站點(diǎn)文件 .036
2.3.1 認(rèn)識(shí)“文件”面板 .036
2.3.2 新建、刪除站點(diǎn)文件 .037
2.3.3 重命名站點(diǎn)文件 .038
2.3.4 上機(jī)練習(xí)——添加網(wǎng)站首頁(yè) .038
2.3.5 移動(dòng)、復(fù)制站點(diǎn)文件 .039
2.4 答疑解惑 .039
2.5 學(xué)習(xí)效果自測(cè) .040
第 3 章 編輯網(wǎng)頁(yè)文本 042
3.1 添加網(wǎng)頁(yè)文本 .043
3.1.1 上機(jī)練習(xí)——直接輸入文本 .043
3.1.2 從其他文檔中復(fù)制文本 .043
3.1.3 導(dǎo)入表格式數(shù)據(jù) .044
3.2 設(shè)置文本格式 .045
3.2.1 設(shè)置文本屬性 .045
3.2.2 文本空格 047
3.2.3 文本換行 048
3.2.4 上機(jī)練習(xí)——美化網(wǎng)頁(yè)文本 .048
3.3 添加其他文本要素 050
3.3.1 插入日期 050
3.3.2 插入特殊字符 .051
3.3.3 創(chuàng)建列表 052
3.3.4 上機(jī)練習(xí)——制作李白詩(shī)作列表 .053
3.4 實(shí)例精講——制作簡(jiǎn)單的文本頁(yè)面 055
3.5 答疑解惑 .060
3.6 學(xué)習(xí)效果自測(cè) .061
第 4 章 在網(wǎng)頁(yè)中應(yīng)用圖像 062
4.1 網(wǎng)頁(yè)中常用的圖像格式 063
4.2 圖像效果 .063
4.2.1 插入圖像 063
4.2.2 設(shè)置圖像屬性 .064
4.2.3 上機(jī)練習(xí)——圖文混排 .065
4.2.4 鼠標(biāo)經(jīng)過(guò)圖像 .066
4.2.5 上機(jī)練習(xí)——制作導(dǎo)航條 .067
4.2.6 水平線 068
4.3 編輯圖像 .069
4.3.1 編輯屬性 069
4.3.2 上機(jī)練習(xí)——使用外部編輯器修改圖像 .070
4.4 實(shí)例精講——制作飲料宣傳頁(yè)面 072
目 錄 V
4.5 答疑解惑 .076
4.6 學(xué)習(xí)效果自測(cè) .077
第 5 章 用表格規(guī)劃網(wǎng)頁(yè) 078
5.1 創(chuàng)建表格的方法 .079
5.1.1 表格的基本組成 .079
5.1.2 上機(jī)練習(xí)——使用“表格”對(duì)話框插入表格 .079
5.1.3 創(chuàng)建嵌套表格 .081
5.2 編輯表格和單元格 082
5.2.1 選擇表格元素 .082
5.2.2 設(shè)置表格屬性 .083
5.2.3 設(shè)置單元格屬性 .084
5.2.4 拆分與合并單元格 .086
5.2.5 上機(jī)練習(xí)——設(shè)計(jì)簡(jiǎn)單的頁(yè)面布局 .086
5.2.6 增加、刪除行或列 .090
5.2.7 復(fù)制、粘貼單元格 .091
5.2.8 上機(jī)練習(xí)——在單元格中添加內(nèi)容 .091
5.3 表格的其他操作 .096
5.3.1 上機(jī)練習(xí)——導(dǎo)入表格式數(shù)據(jù) .096
5.3.2 導(dǎo)出表格數(shù)據(jù) .097
5.3.3 表格數(shù)據(jù)排序 .098
5.4 實(shí)例精講——制作藝術(shù)品網(wǎng)站首頁(yè) 099
5.4.1 設(shè)計(jì)網(wǎng)頁(yè)基本框架 .100
5.4.2 設(shè)計(jì)正文區(qū)域布局 .105
5.4.3 添加網(wǎng)頁(yè)內(nèi)容 .110
5.5 答疑解惑 .114
5.6 學(xué)習(xí)效果自測(cè) .115
第 6 章 超級(jí)鏈接的應(yīng)用  116
6.1 認(rèn)識(shí)超級(jí)鏈接 .117
6.1.1 路徑 117
6.1.2 相對(duì)路徑 118
6.1.3 根相對(duì)路徑 .118
6.2 設(shè)置頁(yè)面鏈接 .119
6.2.1 上機(jī)練習(xí)——創(chuàng)建文本鏈接 .119
6.2.2 圖像鏈接 122
6.2.3 上機(jī)練習(xí)——制作旅游景點(diǎn)地圖 .124
6.2.4 E-mail 鏈接 .126
6.2.5 空鏈接和腳本鏈接 .126
6.2.6 下載鏈接 128
6.2.7 上機(jī)練習(xí)——創(chuàng)建錨點(diǎn)鏈接 .128
6.3 管理超鏈接 .131
6.3.1 認(rèn)識(shí)“URLs”面板 131
VI Dreamweaver CC 2018
中文版入門(mén)與提高
VI Dreamweaver CC 2018
中文版入門(mén)與提高
6.3.2 上機(jī)練習(xí)——添加超鏈接資源 .131
6.4 實(shí)例精講——古詩(shī)詞鑒賞頁(yè)面 133
6.4.1 設(shè)計(jì)頁(yè)面布局 .134
6.4.2 制作導(dǎo)航和頁(yè)腳 .138
6.4.3 制作正文部分 .143
6.4.4 添加鏈接 147
6.5 答疑解惑 .150
6.6 學(xué)習(xí)效果自測(cè) .150
第 7 章 使用多媒體對(duì)象 152
7.1 插入動(dòng)畫(huà)和視頻 .153
7.1.1 插入 Flash SWF 153
7.1.2 插入 Flash 視頻.156
7.1.3 上機(jī)練習(xí)——制作游戲網(wǎng)站引導(dǎo)頁(yè)面 .158
7.1.4 插入 HTML5 視頻 161
7.1.5 插入 Canvas 163
7.1.6 插入動(dòng)畫(huà)合成 .164
7.2 插入音頻 .165
7.2.1 網(wǎng)頁(yè)中常用的音頻格式 .165
7.2.2 上機(jī)練習(xí)——鏈接到聲音文件 .166
7.2.3 將聲音嵌入網(wǎng)頁(yè) .167
7.2.4 上機(jī)練習(xí)——添加背景音樂(lè) .168
7.2.5 插入 HTML5 音頻 171
7.3 實(shí)例精講——多媒體頁(yè)面制作 173
7.3.1 規(guī)劃頁(yè)面布局 .174
7.3.2 制作正文區(qū)域 .177
7.3.3 添加媒體對(duì)象 .182
7.3.4 制作頁(yè)腳 185
7.4 答疑解惑 .187
7.5 學(xué)習(xí)效果自測(cè) .187
第 8 章 利用 CSS Div 設(shè)計(jì)網(wǎng)頁(yè) .189
8.1 了解 CSS 樣式表 190
8.2 創(chuàng)建 CSS 規(guī)則 190
8.2.1 認(rèn)識(shí) CSS 設(shè)計(jì)器 190
8.2.2 指定使用 CSS 的方式 191
8.2.3 定義媒體查詢 .192
8.2.4 指定 CSS 選擇器 194
8.2.5 設(shè)置 CSS 屬性 196
8.2.6 上機(jī)練習(xí)——變化的鼠標(biāo)樣式 .198
8.3 編輯和使用 CSS 規(guī)則 .201
8.3.1 修改 CSS 規(guī)則 201
8.3.2 刪除 CSS 樣式表 202
目 錄 VII
8.3.3 上機(jī)練習(xí)——使用外部樣式表美化網(wǎng)頁(yè) .203
8.4 認(rèn)識(shí) CSS 布局塊 205
8.4.1 CSS 盒模型簡(jiǎn)介 .206
8.4.2 創(chuàng)建 Div 標(biāo)簽 .209
8.4.3 編輯 Div 標(biāo)簽 .211
8.4.4 上機(jī)練習(xí)——制作簡(jiǎn)易公告欄 .213
8.5 常用 CSS 布局版式 .218
8.5.1 上機(jī)練習(xí)——列固定居中 .218
8.5.2 上機(jī)練習(xí)——左、右兩列并排居中 .222
8.5.3 上機(jī)練習(xí)——制作三列布局 .224
8.6 實(shí)例精講——流金歲月 226
8.7 答疑解惑 .231
8.8 學(xué)習(xí)效果自測(cè) .232
第 9 章 創(chuàng)建表單網(wǎng)頁(yè) 233
9.1 認(rèn)識(shí)表單 .234
9.1.1 插入表單 234
9.1.2 設(shè)置表單屬性 .234
9.2 創(chuàng)建表單控件 .236
9.2.1 文本域 236
9.2.2 單選按鈕 239
9.2.3 復(fù)選框 240
9.2.4 選擇框 242
9.2.5 文件域 244
9.2.6 按鈕 245
9.2.7 圖像按鈕 246
9.2.8 上機(jī)練習(xí)——制作個(gè)人信息采集頁(yè)面 .247
9.2.9 HTML5 表單元素 .250
9.3 表單提交與驗(yàn)證 .252
9.3.1 用 E-mail 提交表單 252
9.3.2 上機(jī)練習(xí)——驗(yàn)證必填信息是否為空 .253
9.4 實(shí)例精講——制作在線訂購(gòu)表單頁(yè)面 254
9.5 答疑解惑 .264
9.6 學(xué)習(xí)效果自測(cè) .264
第 10 章 應(yīng)用行為創(chuàng)建交互 266
10.1 認(rèn)識(shí)“行為”面板 267
10.1.1 了解事件與動(dòng)作 .267
10.1.2 上機(jī)練習(xí)——查看圖像可用的行為 .268
10.1.3 應(yīng)用行為 .269
10.1.4 修改行為 .270
10.2 內(nèi)置行為的應(yīng)用 .270
VIII Dreamweaver CC 2018
中文版入門(mén)與提高
VIII Dreamweaver CC 2018
中文版入門(mén)與提高
10.2.1 調(diào)用 JavaScript.271
10.2.2 彈出信息 .271
10.2.3 上機(jī)練習(xí)——顯示圖片信息 .272
10.2.4 改變屬性 .273
10.2.5 上機(jī)練習(xí)——單擊改變背景顏色 .273
10.2.6 檢查插件 .275
10.2.7 jQuery 效果 .276
10.2.8 上機(jī)練習(xí)——跳動(dòng)的小魚(yú) .278
10.2.9 轉(zhuǎn)到 URL 279
10.2.10 打開(kāi)瀏覽器窗口 .280
10.2.11 預(yù)先載入圖像 .280
10.2.12 交換圖像 / 恢復(fù)交換圖像 281
10.2.13 上機(jī)練習(xí)——制作產(chǎn)品展示頁(yè)面 .281
10.2.14 設(shè)置文本 .283
10.2.15 上機(jī)練習(xí)——制作圣誕賀卡 .284
10.2.16 顯示 - 隱藏元素 287
10.2.17 上機(jī)練習(xí)——制作簡(jiǎn)易相冊(cè) .288
10.2.18 檢查表單 .291
10.2.19 上機(jī)練習(xí)——驗(yàn)證表單內(nèi)容的正確性 .292
10.3 答疑解惑 .294
10.4 學(xué)習(xí)效果自測(cè) .295
第 11 章 統(tǒng)一站點(diǎn)風(fēng)格 296
11.1 認(rèn)識(shí)“資源”面板 .297
11.2 創(chuàng)建模板 298
11.2.1 使用“模板”面板創(chuàng)建模板 .298
11.2.2 使用“新建文檔”對(duì)話框創(chuàng)建模板 .299
11.2.3 上機(jī)練習(xí)——將文檔保存為模板 .300
11.3 編輯模板元素 302
11.3.1 可編輯區(qū)域 .302
11.3.2 上機(jī)練習(xí)——制作景點(diǎn)門(mén)票 .303
11.3.3 重復(fù)區(qū)域 .305
11.3.4 上機(jī)練習(xí)——定義嵌套模板 .307
11.4 使用模板 310
11.4.1 基于模板創(chuàng)建網(wǎng)頁(yè) .310
11.4.2 上機(jī)練習(xí)——應(yīng)用模板到頁(yè) .311
11.4.3 分離模板 .313
11.4.4 修改模板并更新站點(diǎn) .313
11.5 創(chuàng)建與使用庫(kù)項(xiàng)目 .315
11.5.1 創(chuàng)建庫(kù)項(xiàng)目 .315
11.5.2 使用庫(kù)項(xiàng)目 .317
11.5.3 上機(jī)練習(xí)——在網(wǎng)頁(yè)中添加版權(quán)聲明 .318
11.5.4 編輯庫(kù)項(xiàng)目 .320
11.6 實(shí)例精講——柳永名作欣賞 .321
11.6.1 制作頁(yè)面基本框架 .321
11.6.2 定義可編輯區(qū)域 .326
11.6.3 制作庫(kù)項(xiàng)目 .327
11.6.4 套用模板制作新頁(yè)面 .328
11.7 答疑解惑 330
11.8 學(xué)習(xí)效果自測(cè) 330
第 12 章 旅游網(wǎng)站綜合實(shí)例 332
12.1 實(shí)例效果 .333
12.2 設(shè)計(jì)思路 .335
12.3 制作步驟 .336
12.3.1 制作頁(yè)面基本框架 .336
12.3.2 制作導(dǎo)航條 .341
12.3.3 制作側(cè)邊欄 .345
12.3.4 制作庫(kù)項(xiàng)目 .348
12.3.5 添加可編輯區(qū)域 .350
12.3.6 制作首頁(yè) .350
12.3.7 制作其他頁(yè)面 .353
附錄 1 HTML 標(biāo)簽概述 355
附錄 2 參考答案 .366
目 錄
DW 實(shí)例源文件 II
1-1 安裝 Dreamweaver CC 2018 .002
1-2 上機(jī)練習(xí)——組合、拆分浮動(dòng)面板組 016
1-3 上機(jī)練習(xí)——創(chuàng)建一個(gè) HTML 頁(yè)面 .017
1-4 上機(jī)練習(xí)——打開(kāi)已有的網(wǎng)頁(yè) 019
1-5 上機(jī)練習(xí)——設(shè)置網(wǎng)頁(yè)外觀 023
2-1 上機(jī)練習(xí)——創(chuàng)建“美食天下”網(wǎng)站 031
2-2 上機(jī)練習(xí)——編輯“美食天下”站點(diǎn) 034
2-3 上機(jī)練習(xí)——添加網(wǎng)站首頁(yè) 038
3-1 上機(jī)練習(xí)——直接輸入文本 043
3-2 上機(jī)練習(xí)——美化網(wǎng)頁(yè)文本 048
3-3 上機(jī)練習(xí)——制作李白詩(shī)作列表 053
3-4 實(shí)例精講——制作簡(jiǎn)單的文本頁(yè)面 055
4-1 上機(jī)練習(xí)——圖文混排 065
4-2 上機(jī)練習(xí)——制作導(dǎo)航條 067
4-3 上機(jī)練習(xí)——使用外部編輯器修改圖像 070
4-4 實(shí)例精講——制作飲料宣傳頁(yè)面 072
5-1 上機(jī)練習(xí)——使用“表格”對(duì)話框插入表格 079
5-2 上機(jī)練習(xí)——設(shè)計(jì)簡(jiǎn)單的頁(yè)面布局 086
5-3 上機(jī)練習(xí)——在單元格中添加內(nèi)容 091
5-4 上機(jī)練習(xí)——導(dǎo)入表格式數(shù)據(jù) 096
5-5 設(shè)計(jì)網(wǎng)頁(yè)基本框架 .100
5-6 設(shè)計(jì)正文區(qū)域布局 .105
5-7 添加網(wǎng)頁(yè)內(nèi)容 .110
6-1 上機(jī)練習(xí)——創(chuàng)建文本鏈接 119
6-2 上機(jī)練習(xí)——制作旅游景點(diǎn)地圖 124
6-3 上機(jī)練習(xí)——創(chuàng)建錨點(diǎn)鏈接 128
6-4 上機(jī)練習(xí)——添加超鏈接資源 131
6-5 設(shè)計(jì)頁(yè)面布局 .134
6-6 制作導(dǎo)航和頁(yè)腳 .138
6-7 制作正文部分 .143
6-8 添加鏈接 .147
二 維 碼 目 錄
XII Dreamweaver CC 2018
中文版入門(mén)與提高
7-1 上機(jī)練習(xí)——制作游戲網(wǎng)站引導(dǎo)頁(yè)面 158
7-2 上機(jī)練習(xí)——鏈接到聲音文件 166
7-3 上機(jī)練習(xí)——添加背景音樂(lè) 168
7-4 規(guī)劃頁(yè)面布局 .174
7-5 制作正文區(qū)域 .177
7-6 添加媒體對(duì)象 .182
7-7 制作頁(yè)腳 .185
8-1 上機(jī)練習(xí)——變化的鼠標(biāo)樣式 198
8-2 上機(jī)練習(xí)——使用外部樣式表美化網(wǎng)頁(yè) 203
8-3 上機(jī)練習(xí)——制作簡(jiǎn)易公告欄 213
8-4 上機(jī)練習(xí)——列固定居中 218
8-5 上機(jī)練習(xí)——左、右兩列并排居中 222
8-6 上機(jī)練習(xí)——制作三列布局 225
8-7 實(shí)例精講——流金歲月 226
9-1 上機(jī)練習(xí)——制作個(gè)人信息采集頁(yè)面 247
9-2 上機(jī)練習(xí)——驗(yàn)證必填信息是否為空 253
9-3 實(shí)例精講——制作在線訂購(gòu)表單頁(yè)面 254
10-1 上機(jī)練習(xí)——查看圖像可用的行為 268
10-2 上機(jī)練習(xí)——顯示圖片信息 272
10-3 上機(jī)練習(xí)——單擊改變背景顏色 273
10-4 上機(jī)練習(xí)——跳動(dòng)的小魚(yú) 278
10-5 上機(jī)練習(xí)——制作產(chǎn)品展示頁(yè)面 281
10-6 上機(jī)練習(xí)——制作圣誕賀卡 284
10-7 上機(jī)練習(xí)——制作簡(jiǎn)易相冊(cè) 288
10-8 上機(jī)練習(xí)——驗(yàn)證表單內(nèi)容的正確性 292
11-1 上機(jī)練習(xí)——將文檔保存為模板 300
11-2 上機(jī)練習(xí)——制作景點(diǎn)門(mén)票 303
11-3 上機(jī)練習(xí)——定義嵌套模板 307
11-4 上機(jī)練習(xí)——應(yīng)用模板到頁(yè) 311
11-5 上機(jī)練習(xí)——在網(wǎng)頁(yè)中添加版權(quán)聲明 318
11-6 制作頁(yè)面基本框架 .321
11-7 定義可編輯區(qū)域 .326
11-8 制作庫(kù)項(xiàng)目 .327
11-9 套用模板制作新頁(yè)面 .328
12-1 制作頁(yè)面基本框架 .336
12-2 制作導(dǎo)航條 .341
12-3 制作側(cè)邊欄 .345
12-4 制作庫(kù)項(xiàng)目 .348
12-5 添加可編輯區(qū)域 .350
12-6 制作首頁(yè) .350
12-7 制作其他頁(yè)面 .353