Chapter 01 網(wǎng)頁(yè)設(shè)計(jì)與制作基礎(chǔ)
1.1　認(rèn)識(shí)網(wǎng)頁(yè)的基本組成 2
1.2　優(yōu)秀網(wǎng)頁(yè)結(jié)構(gòu)賞析 5
1.3　認(rèn)識(shí)靜態(tài)網(wǎng)頁(yè)與動(dòng)態(tài)網(wǎng)頁(yè) 8
1.4　了解網(wǎng)頁(yè)的訪問(wèn)原理 9
1.5　認(rèn)識(shí)域名和域名服務(wù)器 10
1.5.1　域名的各種分類 10
1.5.2　域名服務(wù)器(DNS) 11
1.6　網(wǎng)站設(shè)計(jì)流程 13
1.7　網(wǎng)頁(yè)制作的常用工具 13
1.7.1　內(nèi)容編輯工具 14
1.7.2　網(wǎng)頁(yè)美化工具 14
1.8　實(shí)戰(zhàn)問(wèn)答 15
NO.1　靜態(tài)網(wǎng)頁(yè)與動(dòng)態(tài)網(wǎng)頁(yè)有何區(qū)別 15
NO.2　網(wǎng)頁(yè)設(shè)計(jì)是否必須懂HTML標(biāo)記 15
1.9　思考與練習(xí) 16


Chapter 02 初識(shí)Dreamweaver CC
2.1　Dreamweaver CC的基本操作 18
2.1.1　安裝Dreamweaver CC 18
2.1.2　啟動(dòng)Dreamweaver CC 20
2.1.3　退出Dreamweaver CC 22
2.2　了解Dreamweaver CC的新功能 23
2.3　認(rèn)識(shí)Dreamweaver CC工作環(huán)境 24
2.3.1　菜單欄 24
2.3.2　面板組 24
2.3.3　“插入”面板 24
2.3.4　文檔窗口 26
2.3.5　“屬性”面板 27
2.4　網(wǎng)頁(yè)設(shè)計(jì)的基本操作 28
2.4.1　新建網(wǎng)頁(yè) 28
2.4.2　保存網(wǎng)頁(yè) 28
2.4.3　打開(kāi)網(wǎng)頁(yè) 29
2.4.4　預(yù)覽網(wǎng)頁(yè) 31
2.4.5　關(guān)閉網(wǎng)頁(yè) 31
2.5　實(shí)戰(zhàn)問(wèn)答 33
NO.1　創(chuàng)建網(wǎng)頁(yè)的其他方法 33
NO.2　如何改變預(yù)覽網(wǎng)頁(yè)時(shí)的瀏覽器 33
2.6　思考與練習(xí) 34


Chapter 03 頁(yè)面屬性的設(shè)置
3.1　在對(duì)話框中設(shè)置頁(yè)面屬性 36
3.1.1　設(shè)置外觀(CSS) 36
3.1.2　設(shè)置外觀(HTML) 37
3.1.3　設(shè)置鏈接(CSS) 39
3.1.4　設(shè)置標(biāo)題(CSS) 41
3.1.5　設(shè)置標(biāo)題/編碼 43
3.1.6　設(shè)置跟蹤圖像 44
3.2　使用代碼設(shè)置字體與頁(yè)面背景效果 45
3.2.1　添加頁(yè)面標(biāo)題 45
3.2.2　為文字添加加粗和傾斜格式 46
3.2.3　設(shè)置文字的字號(hào)大小 47
3.2.4　設(shè)置網(wǎng)頁(yè)文本的文本顏色 48
3.2.5　設(shè)置網(wǎng)頁(yè)的背景顏色 49
3.2.6　為網(wǎng)頁(yè)添加背景圖片 50
3.3　使用代碼設(shè)置超鏈接屬性 51
3.3.1　設(shè)置超鏈接的邊距 51
3.3.2　設(shè)置鏈接顏色 52
3.3.3　設(shè)置鼠標(biāo)經(jīng)過(guò)超鏈接效果 53
3.3.4　設(shè)置已訪問(wèn)鏈接 53
3.3.5　設(shè)置活動(dòng)鏈接 54
3.3.6　修改下劃線樣式 54
3.4　實(shí)戰(zhàn)問(wèn)答 55
NO.1　外觀(CSS)和外觀(HTML)有何區(qū)別 55
NO.2　如何讓背景圖片固定 55
3.5　思考與練習(xí) 55


Chapter 04 創(chuàng)建與管理站點(diǎn)
4.1　創(chuàng)建、配置與發(fā)布本地站點(diǎn) 58
4.1.1　創(chuàng)建本地站點(diǎn) 58
4.1.2　為站點(diǎn)定義遠(yuǎn)程服務(wù)器 59
4.1.3　發(fā)布站點(diǎn) 60
4.2　管理站點(diǎn) 61
4.2.1　刪除站點(diǎn) 61
4.2.2　編輯站點(diǎn) 61
4.2.3　復(fù)制站點(diǎn) 62
4.2.4　導(dǎo)出站點(diǎn) 63
4.2.5　導(dǎo)入站點(diǎn) 63
4.3　管理站點(diǎn)中的內(nèi)容 64
4.3.1　添加文件/文件夾 64
4.3.2　重命名和刪除文件/文件夾 65
4.4　實(shí)戰(zhàn)問(wèn)答 65
NO.1　站點(diǎn)已刪除為什么文件還在 65
NO.2　如何將已有文件添加到站點(diǎn)中 66
4.5　思考與練習(xí) 66


Chapter 05 網(wǎng)頁(yè)中的文本創(chuàng)建
5.1　文本的簡(jiǎn)單操作 68
5.1.1　在網(wǎng)頁(yè)中錄入文本 68
5.1.2　讓文本換行分段 69
5.1.3　設(shè)置文本的對(duì)齊方式 69
5.1.4　設(shè)置文本的字體格式 70
5.2　項(xiàng)目列表和編號(hào)列表的使用 71
5.2.1　插入項(xiàng)目列表 71
5.2.2　插入編號(hào)列表 71
5.3　特殊文本的操作 72
5.3.1　插入換行符 72
5.3.2　插入水平線 73
5.3.3　插入日期 74
5.3.4　插入特殊字符 75
5.3.5　插入注釋 76
5.4　實(shí)戰(zhàn)問(wèn)答 77
NO.1　項(xiàng)目列表中列表項(xiàng)前綴是否可以更改 77
NO.2　編號(hào)列表中列表項(xiàng)前綴序號(hào)是否可更改 77
5.5　思考與練習(xí) 78


Chapter 06 在網(wǎng)頁(yè)中插入圖像與多媒體
6.1　常用圖像格式 80
6.1.1　JPEG圖像 80
6.1.2　GIF圖像 80
6.1.3　PNG圖像 80
6.2　在網(wǎng)頁(yè)中使用圖像 81
6.2.1　插入圖像 81
6.2.2　編輯圖像大小 82
6.2.3　設(shè)置圖像對(duì)齊方式 84
6.2.4　裁剪需要的圖像 85
6.2.5　調(diào)整圖片的亮度和對(duì)比度 87
6.2.6　設(shè)置圖像的銳化效果 88
6.3　插入其他圖像元素 90
6.3.1　插入圖像熱區(qū) 90
6.3.2　鼠標(biāo)經(jīng)過(guò)圖像 91
6.4　在網(wǎng)頁(yè)中插入多媒體 93
6.4.1　插入背景音樂(lè) 93
6.4.2　插入Flash動(dòng)畫 94
6.4.3　插入FLV視頻 96
6.4.4　插入HTML5視頻 98
6.4.5　插入HTML5音頻 99
6.4.6　插入其他媒體 101
6.5　實(shí)戰(zhàn)問(wèn)答 102
NO.1　如何讓背景音樂(lè)循環(huán)播放 102
NO.2　為何插入普通視頻的網(wǎng)頁(yè)在其他計(jì)算機(jī)不能播放 103
NO.3　為什么插入HTML5視頻后不能播放 103
6.6　思考與練習(xí) 103


Chapter 07 超鏈接的應(yīng)用
7.1　認(rèn)識(shí)超鏈接的類型 106
7.1.1　按超鏈接源端點(diǎn)的對(duì)象劃分 106
7.1.2　按執(zhí)行超鏈接后的動(dòng)作劃分 106
7.1.3　按超鏈接的鏈接位置劃分 107
7.2　鏈接路徑有哪些分類 108
7.2.1　什么是URL 108
7.2.2　相對(duì)路徑 108
7.2.3　絕對(duì)路徑 109
7.2.4　根路徑 109
7.3　各種超鏈接的創(chuàng)建方法 109
7.3.1　插入文本鏈接 109
7.3.2　設(shè)置鏈接打開(kāi)方式 111
7.3.3　插入圖像鏈接 112
7.3.4　插入熱點(diǎn)鏈接 114
7.3.5　插入錨點(diǎn)鏈接 115
7.3.6　插入空鏈接 117
7.3.7　插入E-mail鏈接 118
7.3.8　插入腳本鏈接 119
7.4　實(shí)戰(zhàn)問(wèn)答 121
NO.1　超鏈接打開(kāi)方式中_BLANK和NEW的區(qū)別 121
NO.2　為什么錨點(diǎn)鏈接不起作用 121
7.5　思考與練習(xí) 121


Chapter 08 表格的應(yīng)用
8.1　創(chuàng)建表格并輸入內(nèi)容 124
8.1.1　精確插入指定行列的表格 124
8.1.2　在表格中輸入內(nèi)容 125
8.1.3　插入嵌套表格 126
8.2　格式化表格效果 127
8.2.1　選擇表格及單元格 127
8.2.2　設(shè)置表格大小和對(duì)齊方式 130
8.2.3　為表格添加邊框 132
8.2.4　設(shè)置單元格中文本和背景格式 133
8.2.5　設(shè)置單元格大小與對(duì)齊方式 134
8.3　編輯表格的常見(jiàn)操作 136
8.3.1　插入行或列 136
8.3.2　刪除行或列 139
8.3.3　復(fù)制、剪切和粘貼單元格 140
8.3.4　合并單元格 141
8.3.5　拆分單元格 142
8.4　表格的高級(jí)操作 143
8.4.1　在網(wǎng)頁(yè)中對(duì)表格數(shù)據(jù)排序 143
8.4.2　導(dǎo)入表格數(shù)據(jù) 145
8.4.3　導(dǎo)出表格數(shù)據(jù) 146
8.5　實(shí)戰(zhàn)問(wèn)答 147
NO.1　如何快速、準(zhǔn)確地選擇表格及單元格 147
NO.2　在表格中能插入圖像文件嗎 147
NO.3　為什么網(wǎng)頁(yè)中的表格無(wú)法進(jìn)行排序操作 149
NO.4　為什么導(dǎo)入到網(wǎng)頁(yè)中的數(shù)據(jù)出現(xiàn)了混亂 149
8.6　思考與練習(xí) 149


Chapter 09 使用CSS層疊樣式表
9.1　了解CSS樣式表 152
9.1.1　什么是CSS 152
9.1.2　CSS的3種類型 152
9.1.3　CSS的語(yǔ)法格式 153
9.2　CSS樣式的嵌入、內(nèi)聯(lián)和外聯(lián)方式 154
9.2.1　嵌入式CSS 154
9.2.2　內(nèi)聯(lián)式CSS 154
9.2.3　外聯(lián)式CSS 155
9.3　各種CSS樣式的創(chuàng)建方法 156
9.3.1　建立ID樣式 156
9.3.2　建立類樣式 158
9.3.3　建立標(biāo)簽樣式 159
9.3.4　建立復(fù)合樣式 160
9.3.5　建立外部樣式 161
9.4　CSS中的常用樣式 162
9.4.1 設(shè)置字體樣式 162
9.4.2　設(shè)置文本樣式 166
9.4.3　設(shè)置背景樣式 167
9.4.4　設(shè)置方框樣式 170
9.4.5　設(shè)置邊框樣式 172
9.4.6　設(shè)置列表樣式 174
9.4.7　設(shè)置定位樣式 176
9.4.8　設(shè)置過(guò)渡樣式 178
9.5　實(shí)戰(zhàn)問(wèn)答 180
NO.1　如何導(dǎo)入外部CSS樣式表文件 180
NO.2　如何自動(dòng)調(diào)整圖像大小 181
9.6　思考與練習(xí) 182


Chapter 10 利用Div層布局
10.1　認(rèn)識(shí)并創(chuàng)建層 184
10.1.1　什么是層 184
10.1.2　創(chuàng)建層 184
10.1.3　創(chuàng)建嵌套層 185
10.1.4　為層添加CSS樣式表 187
10.2　Div層的定位方法 189
10.2.1　什么是盒子模型 189
10.2.2　通過(guò)float屬性定位層 189
10.2.3　通過(guò)position屬性定位層 191
10.3　Div常用布局方式的應(yīng)用 192
10.3.1　居中布局 192
10.3.2　浮動(dòng)布局 193
10.3.3　一列固定寬度布局 194
10.3.4　一列自適應(yīng)寬度布局 194
10.3.5　兩列固定寬度布局 195
10.4　實(shí)戰(zhàn)問(wèn)答 197
NO.1　如何清除Div浮動(dòng) 197
NO.2　如何設(shè)置Div對(duì)象的行高 197
10.5　思考與練習(xí) 198


Chapter 11 使用模板和庫(kù)
11.1　使用模板 200
11.1.1　創(chuàng)建模板 200
11.1.2　定義可編輯區(qū)域 201
11.1.3　創(chuàng)建基于模板的網(wǎng)頁(yè) 202
11.1.4　從模板中分離網(wǎng)頁(yè) 203
11.1.5　管理模板 204
11.2　使用庫(kù) 206
11.2.1　創(chuàng)建庫(kù)文件 206
11.2.2 向頁(yè)面添加庫(kù)文件 207
11.2.3　修改并更新庫(kù)文件 208
11.3　實(shí)戰(zhàn)問(wèn)答 209
NO.1　如何在現(xiàn)有網(wǎng)頁(yè)文件上應(yīng)用模板 209
NO.2　模板可以嵌套模板嗎 209
11.4　思考與練習(xí) 210


Chapter 12 表單的應(yīng)用
12.1　認(rèn)識(shí)網(wǎng)頁(yè)中的表單 212
12.1.1　什么是表單 212
12.1.2　認(rèn)識(shí)表單對(duì)象 212
12.2　創(chuàng)建表單 216
12.2.1　插入表單 216
12.2.2　設(shè)置表單屬性 217
12.3　插入表單對(duì)象 218
12.3.1　插入文本域 218
12.3.2　插入密碼域 221
12.3.3　插入其他文本域 223
12.3.4　插入按鈕對(duì)象 224
12.3.5　插入圖像按鈕 225
12.3.6　插入文件上傳域 226
12.4　實(shí)戰(zhàn)問(wèn)答 228
NO.1　如何通過(guò)“插入”面板添加表單對(duì)象 228
NO.2　如何自動(dòng)選擇文本框中所有文本內(nèi)容 229
12.5　思考與練習(xí) 229


Chapter 13 在網(wǎng)頁(yè)中編寫JavaScript
13.1　了解JavaScript的基礎(chǔ)知識(shí) 232
13.1.1　JavaScript是什么 232
13.1.2　JavaScript能做什么 232
13.1.3　JavaScript怎么用 233
13.2　JavaScript基礎(chǔ)語(yǔ)法 233
13.2.1　了解值和變量 234
13.2.2　了解運(yùn)算符 234
13.2.3　認(rèn)識(shí)各種比較符 234
13.2.4　函數(shù)的使用 234
13.3　掌握J(rèn)avaScript的常用事件 235
13.3.1　窗口事件 235
13.3.2　鼠標(biāo)事件 237
13.3.3　鍵盤事件 238
13.3.4　表單處理事件 239
13.4　jQuery的應(yīng)用 241
13.4.1　jQuery核心函數(shù) 241
13.4.2　使用jQuery選擇器 242
13.4.3　使用jQuery操作對(duì)象屬性 243
13.4.4　使用jQuery事件 245
13.4.5　jQuery中常用的效果 246
13.5　實(shí)戰(zhàn)問(wèn)答 248
NO.1　++與--放置在變量前后的區(qū)別 248
NO.2　解決預(yù)覽頁(yè)面時(shí)腳本執(zhí)行問(wèn)題 249
13.6　思考與練習(xí) 249


Chapter 14 制作婚紗網(wǎng)站
14.1　婚紗網(wǎng)制作介紹 252
14.2　婚紗網(wǎng)制作思路分析 253
14.3　婚紗網(wǎng)制作過(guò)程 254
14.3.1　創(chuàng)建婚紗網(wǎng)站點(diǎn) 254
14.3.2　創(chuàng)建婚紗網(wǎng)模板 255
14.3.3　創(chuàng)建樣式表 257
14.3.4　在模板中制作導(dǎo)航 261
14.3.5　底部制作 265
14.3.6　制作婚紗網(wǎng)首頁(yè) 267
14.3.7　制作聯(lián)系我們頁(yè)面 270
14.3.8　修改模板頁(yè)中的導(dǎo)航菜單 273
14.4　婚紗網(wǎng)案例制作總結(jié) 274
14.5　婚紗網(wǎng)案例制作答疑 274
14.6　實(shí)戰(zhàn)問(wèn)答 274
NO.1　為什么要有Div+CSS布局而不用表格 274
NO.2　為何要減少對(duì)圖像的使用 274
NO.3　如何將制作好的網(wǎng)站發(fā)布到網(wǎng)絡(luò)上 274
NO.4　為什么創(chuàng)建的模板文件在瀏覽器中不能查看 275
習(xí)題答案 277