中文版Dreamweaver CC 2015網(wǎng)頁(yè)制作實(shí)用教程

第1章  Dreamweaver CC 2015快速
入門(mén) 1
1.1  網(wǎng)頁(yè)制作的基礎(chǔ)知識(shí) 1
1.1.1  網(wǎng)頁(yè)與網(wǎng)站 1
1.1.2  網(wǎng)頁(yè)的基本元素 2
1.1.3  網(wǎng)頁(yè)的常見(jiàn)類(lèi)型 4
1.1.4  網(wǎng)頁(yè)的設(shè)計(jì)布局 5
1.2  Dreamweaver CC 2015簡(jiǎn)介 6
1.2.1  Dreamweaver CC 2015的工作
界面 6
1.2.2  網(wǎng)頁(yè)文檔的基本操作 9
1.3  規(guī)劃與創(chuàng)建本地站點(diǎn) 12
1.3.1  站點(diǎn)概述 12
1.3.2  規(guī)劃站點(diǎn) 14
1.3.3  建立本地站點(diǎn) 15
1.3.4  設(shè)置本地站點(diǎn) 17
1.3.5  創(chuàng)建站點(diǎn)文件 17
1.4  設(shè)置Dreamweaver視圖模式 18
1.4.1  切換文檔視圖 18
1.4.2  使用標(biāo)尺、網(wǎng)格和輔助線(xiàn) 19
1.5  上機(jī)練習(xí) 22
1.5.1  創(chuàng)建并設(shè)置網(wǎng)頁(yè)屬性 22
1.5.2  導(dǎo)出與導(dǎo)入站點(diǎn) 24
1.6  習(xí)題 26
第2章  網(wǎng)頁(yè)文本的處理與控制 27
2.1  設(shè)置網(wǎng)頁(yè)標(biāo)題 27
2.2  HTML文件的基本結(jié)構(gòu) 28
2.2.1  HTML文件的基本結(jié)構(gòu) 29
2.2.2  常用HTML標(biāo)簽簡(jiǎn)介 29
2.3  網(wǎng)頁(yè)文本的基本設(shè)置 31
2.3.1  設(shè)置文本標(biāo)題 31
2.3.2  添加空格 34
2.3.3  設(shè)置網(wǎng)頁(yè)文字 35
2.4  使用項(xiàng)目列表 37
2.4.1  設(shè)置無(wú)序列表 37
2.4.2  設(shè)置有序列表 38
2.4.3  定義項(xiàng)目列表 38
2.5  使用外部文本 39
2.5.1  粘貼文本 39
2.5.2  粘貼表格 40
2.5.3  導(dǎo)入Word與Excel文檔 41
2.6  上機(jī)練習(xí) 42
2.6.1  制作網(wǎng)頁(yè)導(dǎo)航欄 42
2.6.2  制作滾動(dòng)文字 44
2.6.3  在網(wǎng)頁(yè)中導(dǎo)入文本 45
2.7  習(xí)題 46
第3章  創(chuàng)建網(wǎng)頁(yè)超鏈接 47
3.1  網(wǎng)頁(yè)超鏈接的概念 47
3.1.1  URL概述 47
3.1.2  超鏈接中的路徑 48
3.2  為文本添加超鏈接 49
3.2.1  添加超鏈接 49
3.2.2  設(shè)置超鏈接 49
3.2.3  使用超鏈接標(biāo)簽 50
3.3  檢查網(wǎng)頁(yè)超鏈接 52
3.4  設(shè)置電子郵件鏈接 53
3.5  添加網(wǎng)頁(yè)錨記鏈接 54
3.5.1  在單一頁(yè)面中添加錨記鏈接 54
3.5.2  在不同頁(yè)面中應(yīng)用錨記鏈接 56
3.6  制作文件下載鏈接 57
3.7  制作音頻和視頻播放鏈接 58
3.8  上機(jī)練習(xí) 59
3.8.1  制作網(wǎng)站導(dǎo)航鏈接 60
3.8.2  在網(wǎng)頁(yè)中設(shè)置超鏈接 62
3.9  習(xí)題 64
第4章  插入圖像與多媒體 65
4.1  網(wǎng)頁(yè)圖像格式簡(jiǎn)介 65
4.2  在網(wǎng)頁(yè)中插入圖片 66
4.2.1  在【設(shè)計(jì)】視圖中插入圖片 66
4.2.2  在【實(shí)時(shí)】視圖中插入圖片 67
4.2.3  通過(guò)【資源】面板插入圖片 67
4.2.4  在網(wǎng)頁(yè)的源代碼中插入圖片 68
4.3  在Dreamweaver中處理圖片 70
4.3.1  網(wǎng)頁(yè)圖片的基本設(shè)置 70
4.3.2  編輯網(wǎng)頁(yè)圖片 70
4.4  使用圖像熱區(qū) 74
4.4.1  繪制圖像熱區(qū) 74
4.4.2  設(shè)置圖像熱區(qū)參數(shù) 76
4.5  制作鼠標(biāo)經(jīng)過(guò)圖像 76
4.6  插入圖像占位符 78
4.7  設(shè)置網(wǎng)頁(yè)背景圖 79
4.8  在網(wǎng)頁(yè)中使用Photoshop文件 80
4.8.1  在Dreamweaver中插入PSD
文件 80
4.8.2  從Photoshop中復(fù)制和粘貼
圖片 82
4.8.3  使用Adobe Photoshop智能對(duì)象
對(duì)象 83
4.9  在網(wǎng)頁(yè)中插入Flash  84
4.9.1  在網(wǎng)頁(yè)中插入Flash動(dòng)畫(huà) 84
4.9.2  設(shè)置Flash動(dòng)畫(huà)屬性 85
4.10  在網(wǎng)頁(yè)中插入視頻與音頻 86
4.10.1  在網(wǎng)頁(yè)中插入FLV視頻 86
4.10.2  在網(wǎng)頁(yè)中插入普通音視頻 88
4.11  在網(wǎng)頁(yè)中插入HTML5視頻與
音頻 89
4.11.1  插入HTML5 Video  89
4.11.2  插入HTML5 Audio  91
4.12  上機(jī)練習(xí) 92
4.12.1  制作網(wǎng)頁(yè)導(dǎo)航條 92
4.12.2  制作視頻在線(xiàn)播放頁(yè)面 95
4.13  習(xí)題 96
第5章  使用表格布局網(wǎng)頁(yè) 97
5.1  在網(wǎng)頁(yè)中使用表格 97
5.1.1  網(wǎng)頁(yè)中表格的用途 97
5.1.2  創(chuàng)建基本表格 98
5.1.3  插入表格元素 99
5.1.4  設(shè)置表格屬性 100
5.2  編輯網(wǎng)頁(yè)中的表格 102
5.2.1  選擇表格元素 103
5.2.2  調(diào)整表格大小 105
5.2.3  更改列寬和行高 106
5.2.4  添加、刪除行或列 106
5.2.5  拆分與合并單元格 107
5.2.6  復(fù)制與粘貼單元格 108
5.2.7  設(shè)置表格內(nèi)容排序 108
5.2.8  導(dǎo)入與導(dǎo)出表格式數(shù)據(jù) 109
5.3  上機(jī)練習(xí) 111
5.4  習(xí)題 116
第6章  使用表單創(chuàng)建交互網(wǎng)頁(yè) 117
6.1  創(chuàng)建表單 117
6.1.1  表單簡(jiǎn)介 117
6.1.2  制作表單 119
6.2  插入表單對(duì)象 120
6.2.1  插入文本域 120
6.2.2  插入密碼域 121
6.2.3  插入文本區(qū)域 121
6.2.4  插入選擇(列表/菜單)  122
6.2.5  插入單選按鈕和復(fù)選框 123
6.2.6  插入文件域 127
6.2.7  插入標(biāo)簽域集 128
6.2.8  插入按鈕和圖像按鈕 130
6.2.9  插入隱藏域 132
6.2.10  插入顏色選擇器 132
6.2.11  插入日期時(shí)間設(shè)定器 133
6.2.12  插入范圍塊 134
6.3  上機(jī)練習(xí) 135
6.3.1  制作用戶(hù)管理頁(yè)面 136
6.3.2  制作商品訂單頁(yè)面 141
6.4  習(xí)題 144
第7章  使用CSS樣式表修飾網(wǎng)頁(yè) 145
7.1  CSS樣式表簡(jiǎn)介 145
7.1.1  認(rèn)識(shí)CSS樣式表 145
7.1.2  CSS的規(guī)則分類(lèi) 146
7.2  使用【CSS設(shè)計(jì)器】面板 147
7.2.1  創(chuàng)建與附加CSS樣式 148
7.2.2  設(shè)定媒體查詢(xún) 150
7.2.3  設(shè)定選擇器 151
7.2.4  修改CSS規(guī)則屬性 152
7.3  使用與編輯CSS樣式 155
7.3.1  應(yīng)用CSS樣式 155
7.3.2  編輯CSS規(guī)則 156
7.4  應(yīng)用CSS3過(guò)渡效果 163
7.4.1  創(chuàng)建CSS3過(guò)渡效果 163
7.4.2  編輯CSS3過(guò)渡效果 166
7.4.3  刪除CSS3過(guò)渡效果 166
7.5  上機(jī)練習(xí) 167
7.6  習(xí)題 172
第8章  使用模板與庫(kù)項(xiàng)目 173
8.1  創(chuàng)建模板 173
8.1.1  模板簡(jiǎn)介 173
8.1.2  將現(xiàn)有網(wǎng)頁(yè)另存為模板 174
8.1.3  創(chuàng)建空白模板 175
8.2  編輯模板 175
8.2.1  設(shè)定可編輯區(qū)域 175
8.2.2  設(shè)定重復(fù)區(qū)域 177
8.2.3  設(shè)定可選區(qū)域 179
8.3  應(yīng)用模板 180
8.3.1  通過(guò)【網(wǎng)站模板】創(chuàng)建網(wǎng)頁(yè) 180
8.3.2  在【資源】面板中創(chuàng)建網(wǎng)頁(yè) 181
8.3.3  為當(dāng)前網(wǎng)頁(yè)應(yīng)用模板 182
8.4  管理模板 182
8.4.1  刪除模板 182
8.4.2  打開(kāi)網(wǎng)頁(yè)的附屬模板 182
8.4.3  更新模板 183
8.4.4  將網(wǎng)頁(yè)脫離模板 183
8.5  使用庫(kù) 183
8.5.1  庫(kù)項(xiàng)目簡(jiǎn)介 183
8.5.2  創(chuàng)建庫(kù)項(xiàng)目 184
8.5.3  設(shè)置庫(kù)項(xiàng)目 184
8.5.4  應(yīng)用庫(kù)項(xiàng)目 185
8.5.5  修改庫(kù)項(xiàng)目 185
8.6  上機(jī)練習(xí) 186
8.6.1  使用模板制作網(wǎng)頁(yè) 186
8.6.2  使用庫(kù)項(xiàng)目制作網(wǎng)頁(yè) 189
8.7  習(xí)題 192
 
第9章  使用Div CSS布局網(wǎng)頁(yè) 193
9.1  Div CSS簡(jiǎn)介 193
9.1.1  認(rèn)識(shí)Div CSS  193
9.1.2  基于CSS的頁(yè)面布局 194
9.1.3  塊元素 195
9.1.4  行內(nèi)元素 195
9.2  在網(wǎng)頁(yè)中插入Div  196
9.2.1  插入Div  196
9.2.2  Div的嵌套 197
9.3  認(rèn)識(shí)Div CSS盒模型 197
9.3.1  margin(邊界)  198
9.3.2  border(邊框)  199
9.3.3  padding(填充)  200
9.3.4  content(內(nèi)容)  200
9.4  Div CSS布局定位 201
9.4.1  relative(相對(duì)定位)  201
9.4.2  absolute(定位)  202
9.4.3  fixed(懸浮定位)  202
9.4.4  float(浮動(dòng)定位)  203
9.5  Div CSS常用布局 203
9.5.1  Div高度自適應(yīng) 203
9.5.2  網(wǎng)頁(yè)內(nèi)容居中布局 206
9.5.3  網(wǎng)頁(yè)元素浮動(dòng)布局 207
9.5.4  使用流體網(wǎng)格布局 211
9.6  上機(jī)練習(xí) 211
9.7  習(xí)題 222
第10章  在網(wǎng)頁(yè)中使用行為 223
10.1  行為概述 223
10.1.1  行為的基礎(chǔ)知識(shí) 223
10.1.2  使用【行為】面板 224
10.1.3  編輯網(wǎng)頁(yè)行為 225
10.2  使用行為調(diào)節(jié)瀏覽器 225
10.2.1  打開(kāi)瀏覽器窗口 225
10.2.2  調(diào)用JavaScript  227
10.2.3  轉(zhuǎn)到URL  227
10.3  使用行為控制圖像 228
10.3.1  交換圖像 228
10.3.2  預(yù)先載入圖像 230
10.4  使用行為顯示文本 231
10.4.1  彈出信息 231
10.4.2  設(shè)置狀態(tài)欄文本 232
10.4.3  設(shè)置容器文本 233
10.4.4  設(shè)置文本域文字 234
10.5  使用行為加載多媒體 235
10.5.1  檢查插件 235
10.5.2  改變屬性 237
10.5.3  顯示-隱藏元素 238
10.6  使用行為控制表單 239
10.6.1  跳轉(zhuǎn)菜單 239
10.6.2  跳轉(zhuǎn)菜單開(kāi)始 240
10.6.3  檢查表單 241
10.7  上機(jī)練習(xí) 242
10.7.1  設(shè)置隱藏與顯示頁(yè)面元素
特效 242
10.7.2  設(shè)置彈出信息網(wǎng)頁(yè)行為 246
10.8  習(xí)題 248
第11章  創(chuàng)建移動(dòng)設(shè)備網(wǎng)頁(yè) 249
11.1  jQuery與jQuery Mobile  249
11.1.1  jQuery  249
11.1.2  jQuery Mobile  250
11.2  創(chuàng)建jQuery Mobile頁(yè)面 250
11.3  使用jQuery Mobile組件 253
11.3.1  使用列表視圖 253
11.3.2  使用布局網(wǎng)格 258
11.3.3  使用可折疊區(qū)塊 260
11.3.4  使用文本輸入框 261
11.3.5  使用密碼輸入框 262
11.3.6  使用文本區(qū)域 263
11.3.7  使用選擇菜單 263
11.3.8  使用復(fù)選框 264
11.3.9  使用單選按鈕 265
11.3.10  使用按鈕 266
11.3.11  使用滑塊 268
11.3.12  設(shè)置翻轉(zhuǎn)切換開(kāi)關(guān) 268
11.4  使用jQuery Mobile主題 269
11.5  使用Bootstrap布局框架 271
11.5.1  創(chuàng)建Bootstrap文件 271
11.5.2  使用Bootstrap模板 272
11.6  上機(jī)練習(xí) 273
11.7  習(xí)題 276
第12章  網(wǎng)頁(yè)制作綜合實(shí)例 277
12.1  創(chuàng)建本地站點(diǎn) 277
12.2  創(chuàng)建網(wǎng)站首頁(yè) 278
12.3  制作網(wǎng)頁(yè)模板 284
12.4  網(wǎng)頁(yè)后期處理 287
12.5  習(xí)題 290