網(wǎng)頁制作與網(wǎng)站組建從新手到高手（CC 2015中文版）

第1章 網(wǎng)頁設(shè)計(jì)基礎(chǔ) 1
1.1 網(wǎng)站設(shè)計(jì)概述 2
1.1.1 網(wǎng)站整體策劃 2
1.1.2 網(wǎng)頁設(shè)計(jì)任務(wù) 2
1.1.3 網(wǎng)頁設(shè)計(jì)實(shí)現(xiàn) 4
1.2 網(wǎng)頁設(shè)計(jì)與開發(fā)技術(shù) 6
1.2.1 前臺(tái)技術(shù) 6
1.2.2 后臺(tái)技術(shù) 7
1.3 網(wǎng)頁構(gòu)成與布局 8
1.3.1 網(wǎng)頁版塊構(gòu)成 8
1.3.2 網(wǎng)頁布局 9
1.4 網(wǎng)頁配色 10
1.4.1 色彩的基礎(chǔ)概念 10
1.4.2 色彩的模式 14
1.4.3 自定義網(wǎng)頁顏色 15
1.4.4 色彩推移 16
1.5 網(wǎng)頁的藝術(shù)表現(xiàn)與風(fēng)格設(shè)計(jì) 17
1.5.1 網(wǎng)頁形式的藝術(shù)表現(xiàn) 17
1.5.2 網(wǎng)頁構(gòu)成的藝術(shù)表現(xiàn) 19
1.5.3 網(wǎng)頁紋理的藝術(shù)表現(xiàn) 20
1.5.4 網(wǎng)頁設(shè)計(jì)風(fēng)格類型 22
第2章 網(wǎng)頁圖像設(shè)計(jì)基礎(chǔ) 24
2.1 Photoshop CC 2015簡介 25
2.1.1 Photoshop基本功能 25
2.1.2 Photoshop CC 2015新增
功能 26
2.1.3 Photoshop窗口界面 28
2.2 Photoshop基本操作 32
2.2.1 文件操作 32
2.2.2 圖像操作 32
2.3 選取區(qū)域與繪制 34
2.3.1 使用選框工具 34
2.3.2 使用套索工具 36
2.3.3 使用魔棒工具 37
2.3.4 【色彩范圍】命令 37
2.3.5 選區(qū)基本操作 39
2.4 練習(xí)：設(shè)計(jì)網(wǎng)站Logo 41
2.5 練習(xí)：制作個(gè)人博客網(wǎng)頁界面 44
2.6 新手訓(xùn)練營 48
第3章 網(wǎng)頁圖像處理 51
3.1 應(yīng)用圖層 52
3.1.1 圖層的基本操作 52
3.1.2 圖層分組 54
3.1.3 圖層的混合模式 55
3.1.4 圖層樣式 58
3.2 繪制與修復(fù)圖像 59
3.2.1 畫筆工具 59
3.2.2 圖章工具 61
3.2.3 填充工具 62
3.3 使用路徑效果 63
3.3.1 鋼筆工具 63
3.3.2 自由鋼筆工具 64
3.3.3 幾何圖路徑 64
3.3.4 形狀路徑 66
3.4 創(chuàng)建圖像文本 67
3.4.1 創(chuàng)建文本 67
3.4.2 創(chuàng)建段落文本 68
3.4.3 修改文字外觀 68
3.4.4 文字繞路徑 69
3.5 練習(xí)：設(shè)計(jì)化妝品廣告網(wǎng)幅 70
3.6 練習(xí)：制作火焰特效文字 73
3.7 新手訓(xùn)練營 77
第4章 網(wǎng)頁界面設(shè)計(jì) 80
4.1 應(yīng)用蒙版 81
4.1.1 快速蒙版 81
4.1.2 剪貼蒙版 81
4.1.3 圖層蒙版 82
4.1.4 矢量蒙版 83
4.2 應(yīng)用濾鏡 85
4.2.1 校正性濾鏡 85
4.2.2 破壞和效果性濾鏡 87
4.2.3 Adobe Camera Raw濾鏡 87
4.3 應(yīng)用3D效果 89
4.3.1 創(chuàng)建3D對象 89
4.3.2 編輯3D對象 90
4.3.3 設(shè)置3D對象屬性 91
4.4 優(yōu)化設(shè)置 93
4.4.1 制作切片 93
4.4.2 優(yōu)化圖像 94
4.5 練習(xí)：制作噴濺邊框 95
4.6 練習(xí)：制作網(wǎng)頁首頁 98
4.7 新手訓(xùn)練營 102
第5章 網(wǎng)頁動(dòng)畫設(shè)計(jì) 105
5.1 Flash CC簡介 106
5.1.1 Flash CC的工作界面 106
5.1.2 Flash CC的新增功能 107
5.1.3 網(wǎng)頁動(dòng)畫形式 108
5.2 管理庫資源 109
5.2.1 導(dǎo)入動(dòng)畫素材 109
5.2.2 創(chuàng)建元件 109
5.3 繪制矢量圖形 111
5.3.1 使用線條工具 111
5.3.2 使用鉛筆工具 111
5.3.3 使用橢圓工具 112
5.3.4 設(shè)置顏色工具 113
5.3.5 使用矩形工具 114
5.4 對象的基本操作 115
5.4.1 選擇固定區(qū)域 115
5.4.2 選擇不規(guī)則區(qū)域 116
5.4.3 任意變形形狀 116
5.5 設(shè)置動(dòng)畫文本 117
5.5.1 創(chuàng)建文本 117
5.5.2 編輯文本 117
5.6 練習(xí)：制作古詩鑒賞界面 118
5.7 練習(xí)：制作郵票 120
5.8 新手訓(xùn)練營 123
第6章 交互動(dòng)畫設(shè)計(jì) 125
6.1 Flash濾鏡和色彩 126
6.1.1 濾鏡 126
6.1.2 色彩效果 128
6.2 傳統(tǒng)動(dòng)畫設(shè)計(jì) 129
6.2.1 補(bǔ)間形狀動(dòng)畫 129
6.2.2 傳統(tǒng)補(bǔ)間動(dòng)畫 130
6.2.3 運(yùn)動(dòng)引導(dǎo)動(dòng)畫 131
6.2.4 遮罩動(dòng)畫 132
6.2.5 逐幀動(dòng)畫 133
6.3 補(bǔ)間動(dòng)畫設(shè)計(jì) 133
6.3.1 補(bǔ)間動(dòng)作動(dòng)畫 133
6.3.2 動(dòng)畫編輯器 134
6.4 練習(xí)：制作圣誕賀卡 135
6.5 練習(xí)：制作網(wǎng)頁時(shí)尚廣告 138
6.6 新手訓(xùn)練營 142
第7章 設(shè)置網(wǎng)頁文本 144
7.1 Dreamweaver CC簡介 145
7.1.1 Dreamweaver CC新增
功能 145
7.1.2 Dreamweaver CC工作
界面 147
7.2 設(shè)置網(wǎng)頁文檔 148
7.2.1 創(chuàng)建站點(diǎn) 148
7.2.2 創(chuàng)建網(wǎng)頁文檔 150
7.2.3 設(shè)置網(wǎng)頁屬性 151
7.3 設(shè)置網(wǎng)頁文本 154
7.3.1 插入網(wǎng)頁文本 154
7.3.2 設(shè)置文本屬性 155
7.3.3 插入特殊文本 156
7.4 設(shè)置文檔列表 157
7.4.1 項(xiàng)目列表與編號 157
7.4.2 嵌套項(xiàng)目列表 158
7.4.3 設(shè)置列表屬性 159
7.5 設(shè)置文本格式 159
7.5.1 設(shè)置HTML樣式 159
7.5.2 設(shè)置段落樣式 160
7.6 練習(xí)：制作詩詞欣賞頁 162
7.7 練習(xí)：制作班級管理制度 164
7.8 新手訓(xùn)練營 167
第8章 設(shè)置網(wǎng)頁圖像元素 170
8.1 添加圖像 171
8.1.1 網(wǎng)頁圖像格式 171
8.1.2 插入圖像 171
8.1.3 設(shè)置圖像屬性 172
8.2 編輯圖像 173
8.2.1 更改圖像 173
8.2.2 調(diào)整圖像 174
8.2.3 使用圖像熱點(diǎn) 175
8.3 插入圖像對象 176
8.3.1 插入背景圖像 176
8.3.2 插入Photoshop智能
對象 176
8.4 練習(xí)：制作招商信息網(wǎng)頁 178
8.5 練習(xí)：制作新聞圖片網(wǎng)頁 181
8.6 新手訓(xùn)練營 186
第9章 設(shè)置網(wǎng)頁鏈接 189
9.1 創(chuàng)建文本與圖像鏈接 190
9.1.1 創(chuàng)建文本鏈接 190
9.1.2 創(chuàng)建圖像鏈接 191
9.2 編輯鏈接 191
9.2.1 檢查鏈接狀態(tài) 191
9.2.2 測試鏈接 192
9.2.3 更改所有鏈接 192
9.2.4 設(shè)置新鏈接的相對路徑 193
9.3 創(chuàng)建其他鏈接 193
9.3.1 創(chuàng)建電子郵件鏈接 193
9.3.2 創(chuàng)建腳本鏈接 194
9.3.3 創(chuàng)建空鏈接 194
9.3.4 創(chuàng)建文件下載鏈接 195
9.3.5 創(chuàng)建錨記鏈接 195
9.4 練習(xí)：制作頁面導(dǎo)航條 196
9.5 練習(xí)：制作網(wǎng)站引導(dǎo)頁 198
9.6 新手訓(xùn)練營 200
第10章 設(shè)計(jì)多媒體網(wǎng)頁 203
10.1 插入Flash 204
10.1.1 插入Flash動(dòng)畫 204
10.1.2 插入Flash視頻 205
10.2 插入HTML5媒體 207
10.2.1 插入HTML5音頻 207
10.2.2 插入HTML5視頻 208
10.2.3 HTML5媒體屬性 209
10.2.4 HTML5媒體方法 212
10.2.5 HTML5媒體事件 213
10.3 插入其他媒體對象 214
10.3.1 插入Edge Animate 214
10.3.2 插入媒體插件 215
10.4 練習(xí)：制作音樂播放網(wǎng)頁 216
10.5 練習(xí)：制作導(dǎo)航條版塊 219
10.6 新手訓(xùn)練營 222
第11章 傳統(tǒng)方式布局 224
11.1 創(chuàng)建表格 225
11.1.1 插入表格 225
11.1.2 創(chuàng)建嵌套表格 225
11.1.3 添加表格內(nèi)容 226
11.2 編輯表格 227
11.2.1 選擇表格 227
11.2.2 調(diào)整表格 227
11.2.3 操作單元格 229
11.3 設(shè)置表格 230
11.3.1 設(shè)置表格屬性 230
11.3.2 設(shè)置單元格屬性 231
11.4 處理表格數(shù)據(jù) 231
11.4.1 排序數(shù)據(jù) 231
11.4.2 導(dǎo)入/導(dǎo)出表格數(shù)據(jù) 232
11.5 應(yīng)用IFrame框架 233
11.5.1 IFrame框架概述 233
11.5.2 插入IFrame框架 234
11.5.3 鏈接IFrame框架頁面 235
11.6 練習(xí)：制作個(gè)人簡歷 235
11.7 練習(xí)：制作購物車頁 240
11.8 新手訓(xùn)練營 242
第12章 設(shè)計(jì)表單元素 244
12.1 添加表單 245
12.1.1 表單概述 245
12.1.2 插入表單 245
12.2 添加文本和網(wǎng)頁元素 247
12.2.1 添加文本元素 247
12.2.2 添加網(wǎng)頁元素 249
12.3 添加日期和時(shí)間元素 252
12.3.1 添加月和周對象 252
12.3.2 添加日期時(shí)間對象 253
12.4 添加選擇與按鈕元素 254
12.4.1 添加選擇元素 254
12.4.2 添加按鈕元素 257
12.5 練習(xí)：制作用戶注冊頁面 259
12.6 練習(xí)：制作問卷調(diào)查表 263
12.7 新手訓(xùn)練營 266
第13章 XHTML標(biāo)記語言 268
13.1 XHTML基本語法 269
13.1.1 XHTML概述 269
13.1.2 XHTML文檔結(jié)構(gòu) 269
13.1.3 XHTML文檔類型聲明 270
13.2 XHTML語法規(guī)范和屬性 270
13.2.1 XHTML語法規(guī)范 271
13.2.2 XHTML標(biāo)準(zhǔn)屬性 272
13.3 XHTML常用元素 273
13.3.1 塊狀標(biāo)簽 273
13.3.2 內(nèi)聯(lián)標(biāo)簽 275
13.3.3 按鈕標(biāo)簽 276
13.3.4 內(nèi)聯(lián)框架標(biāo)簽 277
13.4 練習(xí)：制作友情鏈接頁面 278
13.5 練習(xí)：制作全景圖像欣賞頁面 282
13.6 新手訓(xùn)練營 284
第14章 設(shè)計(jì)網(wǎng)頁元素樣式 287
14.1 CSS樣式概述 288
14.1.1 了解CSS樣式 288
14.1.2 CSS樣式分類 289
14.1.3 CSS書寫規(guī)范 290
14.2 使用【CSS設(shè)計(jì)器】面板 291
14.2.1 源 291
14.2.2 @媒體 293
14.2.3 選擇器 294
14.2.4 屬性 294
14.3 CSS選擇器和方法 295
14.3.1 CSS選擇器 295
14.3.2 CSS選擇方法 297
14.4 設(shè)置CSS樣式 298
14.4.1 設(shè)置布局樣式 298
14.4.2 設(shè)置文本樣式 299
14.4.3 設(shè)置邊框樣式 301
14.4.4 設(shè)置背景樣式 301
14.5 使用CSS過渡效果 302
14.5.1 創(chuàng)建CSS過渡效果 302
14.5.2 編輯CSS過渡效果 303
14.6 練習(xí)：制作多彩時(shí)尚頁 303
14.7 練習(xí)：制作圖片新聞頁 306
14.8 新手訓(xùn)練營 309
第15章 布局網(wǎng)頁 311
15.1 應(yīng)用Div標(biāo)簽 312
15.1.1 了解Div標(biāo)簽 312
15.1.2 插入Div標(biāo)簽 312
15.1.3 編輯Div標(biāo)簽 313
15.2 CSS盒模型 314
15.2.1 盒模型概述 314
15.2.2 設(shè)置盒模型屬性 315
15.2.3 CSS 3.0新增盒模型屬性 317
15.3 CSS布局方式 318
15.3.1 流動(dòng)布局 318
15.3.2 浮動(dòng)布局 319
15.3.3 絕對定位布局 320
15.4 練習(xí)：制作企業(yè)網(wǎng)頁 322
15.5 練習(xí)：制作家居網(wǎng)頁 324
15.6 新手訓(xùn)練營 327
第16章 網(wǎng)頁行為特效 329
16.1 網(wǎng)頁行為概述 330
16.1.1 什么是行為 330
16.1.2 行為面板概述 330
16.2 設(shè)置文本信息行為 331
16.2.1 設(shè)置容器文本 331
16.2.2 設(shè)置文本域文字 331
16.2.3 設(shè)置狀態(tài)欄文本 332
16.2.4 設(shè)置框架文本 332
16.3 設(shè)置網(wǎng)頁信息行為 333
16.3.1 設(shè)置窗口信息行為 333
16.3.2 設(shè)置圖像信息行為 334
16.3.3 設(shè)置跳轉(zhuǎn)信息行為 335
16.3.4 設(shè)置其他網(wǎng)頁信息行為 336
16.4 設(shè)置jQuery效果 338
16.4.1 設(shè)置Blind效果 338
16.4.2 設(shè)置Highlight效果 339
16.4.3 其他jQuery效果 339
16.5 練習(xí)：制作網(wǎng)頁導(dǎo)航 340
16.6 練習(xí)：制作企業(yè)首頁 343
16.7 新手訓(xùn)練營 347