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

時(shí)間：2023-07-07 03:42:02 | 來源：營銷百科

時(shí)間：2023-07-07 03:42:02 來源：營銷百科

網(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]

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^[1]

第2章網(wǎng)頁圖像設(shè)計(jì)基礎(chǔ) 24

2.1PhotoshopCC2015簡介 25

2.1.1Photoshop基本功能 25

2.1.2PhotoshopCC2015新增

功能 26

2.1.3Photoshop窗口界面 28

2.2Photoshop基本操作 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.3AdobeCameraRaw濾鏡 87

4.3應(yīng)用3D效果 89

4.3.1創(chuàng)建3D對(duì)象 89

4.3.2編輯3D對(duì)象 90

4.3.3設(shè)置3D對(duì)象屬性 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.1FlashCC簡介 106

5.1.1FlashCC的工作界面 106

5.1.2FlashCC的新增功能 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對(duì)象的基本操作 115

5.4.1選擇固定區(qū)域 115

5.4.2選擇不規(guī)則區(qū)域 116

5.4.3任意變形形狀 116

5.5設(shè)置動(dòng)畫文本 117^[2]

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.1Flash濾鏡和色彩 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.1DreamweaverCC簡介 145

7.1.1DreamweaverCC新增

功能 145

7.1.2DreamweaverCC工作

界面 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)目列表與編號(hào) 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í)：制作班級(jí)管理制度 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插入圖像對(duì)象 176

8.3.1插入背景圖像 176

8.3.2插入Photoshop智能

對(duì)象 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測(cè)試鏈接 192

9.2.3更改所有鏈接 192

9.2.4設(shè)置新鏈接的相對(duì)路徑 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.3HTML5媒體屬性 209

10.2.4HTML5媒體方法 212

10.2.5HTML5媒體事件 213

10.3插入其他媒體對(duì)象 214

10.3.1插入EdgeAnimate 214

10.3.2插入媒體插件 215

10.4練習(xí)：制作音樂播放網(wǎng)頁 216

10.5練習(xí)：制作導(dǎo)航條版塊 219^[2]

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.1IFrame框架概述 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添加月和周對(duì)象 252

12.3.2添加日期時(shí)間對(duì)象 253

12.4添加選擇與按鈕元素 254

12.4.1添加選擇元素 254

12.4.2添加按鈕元素 257

12.5練習(xí)：制作用戶注冊(cè)頁面 259

12.6練習(xí)：制作問卷調(diào)查表 263

12.7新手訓(xùn)練營 266

第13章XHTML標(biāo)記語言 268

13.1XHTML基本語法 269

13.1.1XHTML概述 269

13.1.2XHTML文檔結(jié)構(gòu) 269

13.1.3XHTML文檔類型聲明 270

13.2XHTML語法規(guī)范和屬性 270

13.2.1XHTML語法規(guī)范 271

13.2.2XHTML標(biāo)準(zhǔn)屬性 272

13.3XHTML常用元素 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.1CSS樣式概述 288

14.1.1了解CSS樣式 288

14.1.2CSS樣式分類 289

14.1.3CSS書寫規(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.3CSS選擇器和方法 295

14.3.1CSS選擇器 295

14.3.2CSS選擇方法 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.2CSS盒模型 314

15.2.1盒模型概述 314

15.2.2設(shè)置盒模型屬性 315

15.2.3CSS3.0新增盒模型屬性 317

15.3CSS布局方式 318

15.3.1流動(dòng)布局 318

15.3.2浮動(dòng)布局 319

15.3.3絕對(duì)定位布局 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^[2]