目錄

第1篇  基礎知識

第1章開啟網頁設計之路——網頁設計與制作基礎

1.1  認識網頁和網站   4

1.1.1什麼是網頁         4

1.1.2什麼是網站         5

1.1.3網站的種類和特點    5

1.2  網頁的相關概念   6

1.2.1因特網與萬維網         6

1.2.2瀏覽器與HTML 6

1.2.3URL、域名與IP地址          7

1.2.4上傳和下載         8

1.3  網頁的HTML構成         8

1.3.1文檔標簽    9

1.3.2頭部標簽    9

1.3.3主體標簽    9

1.4 
HTML常用標簽     9

1.5  實戰演練——制作日程表   21

1.6  高手甜點        25

1.7  跟我練練手   26

第2章磨刀不誤砍柴工——認識Dreamweaver CC7

2.1  走進Dreamweaver
CC  28

2.1.1案例1——安裝Dreamweaver
CC    28

2.1.2案例2——啟動Dreamweaver
CC    29

2.2 
Dreamweaver CC的工作環境      30

2.2.1認識Dreamweaver CC的工作界面  30

2.2.2熟悉【插入】面板組         32

2.3  體驗Dreamweaver
CC的新增功能     34

2.4  認識站點        36

2.5  創建站點        36

2.5.1案例3——創建本地站點 37

2.5.2案例4——創建遠程站點 37

2.6  管理站點        38

2.6.1案例5——打開站點 38

2.6.2案例6——編輯站點 39

2.6.3案例7——刪除站點 39

2.6.4案例8——復制站點 40

2.7  操作站點文件及文件夾        40

2.7.1案例9——創建文件夾      40

2.7.2案例10——創建文件        41

2.7.3案例11——文件或文件夾的移動和復制        41

2.7.4案例12——刪除文件或文件夾        42

2.8  實戰演練1——創建本地站點     42

2.9  實戰演練2——創建站點文件和文件夾     43

2.10 
高手甜點      45

2.11 
跟我練練手 46

第3章網頁內容之美——創建網頁中的文本

3.1  網頁設計的基本操作   48

3.1.1案例1——新建網頁 48

3.1.2案例2——保存網頁 48

3.1.3案例3——打開網頁 49

3.1.4案例4——預覽網頁 49

3.2  設置頁面屬性        50

3.3  用文字充實網頁   54

3.3.1案例5——插入文字 54

3.3.2案例6——設置字體 55

3.3.3案例7——設置字號 57

3.3.4案例8——設置字體顏色 57

3.3.5案例9——設置字體樣式 58

3.3.6案例10——編輯段落        59

3.3.7案例11——檢查拼寫        64

3.3.8案例12——創建項目列表        65

3.4  特殊文本的操作   67

3.4.1案例13——插入換行符   67

3.4.2案例14——插入水平線   67

3.4.3案例15——插入日期        68

3.4.4案例16——插入特殊字符        69

3.4.5案例17——插入注釋        70

3.5  實戰演練——設置主頁中的跟蹤圖像        71

3.6  高手甜點        73

3.7  跟我練練手   74

第2篇  核心技術

第4章有圖有真相——使用圖像和多媒體

4.1  選擇適合網頁中圖像的格式        78

4.2  用圖像美化網頁   79

4.2.1案例1——插入圖像 79

4.2.2案例2——圖像屬性設置 80

4.2.3案例3——圖像的對齊方式      82

4.2.4案例4——插入鼠標經過圖像 83

4.2.5案例5——插入圖像占位符      84

4.3  在網頁中插入多媒體   85

4.3.1案例6——插入背景音樂 85

4.3.2案例7——插入Flash動畫        86

4.3.3案例8——插入FLV   87

4.3.4案例9——插入HTML5音頻    88

4.3.5案例10——插入HTML5視頻  89

4.4實戰演練——制作圖文並茂的網頁   90

4.5  高手甜點        92

4.6  跟我練練手   92

第5章Web新面孔——HTML素與屬性速覽

5.1  新增的主素   94

5.1.1案例1——sect素     94

5.1.2案例2——arti素       94

5.1.3案例3——as素         97

5.1.4案例4——素   98

5.1.5案例5——t素 100

5.2  新增的非主素        101

5.2.1案例6——hea素     101

5.2.2案例7——hgr素     102

5.2.3案例8——foo素       103

5.2.4案例9——fig素        104

5.2.5案例10——addr素 105

5.3  新增其素        107

5.3.1案例11——m素       107

5.3.2案例12——rp、rt與r素        107

5.3.3案例13——progr素         108

5.3.4案例14——comm素       109

5.3.5案例15——em素   109

5.3.6案例16——details與summ素       110

5.3.7案例17——datal素  110

5.4  新增的全局屬性   111

5.4.1案例18——content
Editable屬性    111

5.4.2案例19——spellcheck屬性      112

5.4.3案例20——tabIndex屬性         112

5.5  新增的其他屬性與廢除的屬性   114

5.5.1案例21——表單相關的屬性   114

5.5.2案例22——鏈接相關屬性        119

5.5.3案例23——其他新增屬性        121

5.5.4案例24——HTML5廢除的屬性       121

5.6  實戰演練——制作HTML5的網頁      123

5.7  高手甜點        125

5.8  跟我練練手   126

第6章不在網頁中迷路——設計網頁超鏈接

6.1  鏈接與路徑   128

6.1.1鏈接的概念         128

6.1.2鏈接的路徑         128

6.1.3鏈接的類型         129

6.2  添加網頁超鏈接   130

6.2.1案例1——添加文本鏈接 130

6.2.2案例2——添加圖像鏈接 131

6.2.3案例3——創建外部鏈接 132

6.2.4案例4——創建錨記鏈接 132

6.2.5案例5——創建圖像熱點鏈接 133

6.2.6案例6——創建電子郵件鏈接 134

6.2.7案例7——創建下載文件的鏈接      135

6.2.8案例8——創建空鏈接      136

6.2.9案例9——創建腳本鏈接 136

6.2.10 
案例10——鏈接的檢查 137

6.3  實戰演練——為企業網站添加友情鏈接   138

6.4  高手甜點        139

6.5  跟我練練手   139

第7章簡單的網頁布局——表格的應用

7.1  插入表格        142

7.2  選擇表格        143

7.2.1案例1——選擇完整的表格      143

7.2.2案例2——選擇行和列      144

7.2.3案例3——格      144

7.3  表格屬性        145

7.3.1案例4——格屬性      145

7.3.2案例5——設置整個表格屬性 146

7.4  操作表格        147

7.4.1案例6——調整大小 147

7.4.2案例7——增加行、列      147

7.4.3案例8——刪除行、列      149

7.4.4案例9——剪切、復制和格      149

7.4.5案例10——合並和格        150

7.5操作表格數據        151

7.5.1案例11——向表格中輸入文本        151

7.5.2案例12——向表格中插入圖像        151

7.5.3案例13——表格數據的排序   152

7.5.4案例14——導入表格數據        153

7.5.5案例15——導出表格數據        153

7.6  實戰演練——使用表格布局網頁        154

7.7  高手甜點        157

7.8  跟我練練手   158

第8章讓網頁互動起來——使用網頁表單和行為

8.1  認識表單        160

8.2  在網頁中插素        160

8.2.1案例1——插入表單域      161

8.2.2案例2——插入文本域      161

8.2.3案例3——插入密碼域      163

8.3  在網頁中插入復選框和單選按鈕        164

8.3.1案例4——插入復選框      164

8.3.2案例5——插入單選按鈕 165

8.4  制作網頁菜單和列表   165

8.4.1案例6——插入下拉菜單 165

8.4.2案例7——插入滾動列表 166

8.5  在網頁中插入按鈕        167

8.5.1案例8——插入按鈕 167

8.5.2案例9——插入圖像按鈕 167

8.6  插入文件上傳域   168

8.7  添加網頁行為        169

8.7.1案例10——打開【行為】面板        169

8.7.2案例11——添加行為        170

8.8  常用行為的應用   170

8.8.1案例12——交換圖像        171

8.8.2案例13——彈出信息        172

8.8.3案例14——打開瀏覽器窗口   173

8.8.4案例15——檢查表單行為        175

8.8.5案例16——設置狀態欄文本   177

8.9  實戰演練——使用表單制作留言本   178

8.10 
高手甜點      181

8.11 
跟我練練手 182

第9章批量制作風格統一的網頁——使用模板和庫

9.1  創建模板        184

9.1.1案例1——在空白文檔中創建模板 184

9.1.2案例2——在【資源】面板中創建模板 184

9.1.3案例3——從現有文檔創建模板      185

9.1.4案例4——創建可編輯區域      186

9.2  管理模板        187

9.2.1案例5——從模板中分離文檔 187

9.2.2案例6——更新模板及基於模板的網頁 188

9.3  庫概述   189

9.4  庫的創建、管理與應用        190

9.4.1案例7——創建庫項目      190

9.4.2案例8——庫項目的應用 191

9.4.3案例9——編輯庫項目      192

9.5  實戰演練——創建基於模板的頁面   194

9.6高手甜點        196

9.7跟我練練手   196

第3篇  高級應用

第10章讀懂樣式表密碼——使用CSS樣式表美化網頁

10.1 
初識CSS       200

10.1.1CSS概述    200

10.1.2CSS的作用        200

10.1.3基本CSS語法   201

10.1.4案例1——使用Dreamweaver
CC

            
編寫CSS         201

10.2 
使用CSS的方法  203

10.2.1案例2——行內樣式        203

10.2.2案例3——內嵌樣式        203

10.2.3案例4——鏈接樣式        204

10.2.4案例5——導入樣式        205

10.2.5案例6——優先級問題   206

10.3 
使用CSS樣式美化網頁      208

10.3.1案例7——使用字體樣式美化文字        208

10.3.2案例8——使用文本樣式美化文本        212

10.3.3案例9——使用背景樣式美化背景        215

10.3.4案例10——使用鏈接樣式美化鏈接      218

10.3.5案例11——使用列表樣式美化列表      219

10.3.6案例12——使用區塊樣式美化區塊      221

10.3.7案例13——使用寬高樣式設定寬高      222

10.3.8案例14——使用邊框樣式美化邊框      223

10.4 
實戰演練——設定網頁中鏈接樣式 225

10.5 
高手甜點      228

10.6 
跟我練練手 228

第11章架構師的大比拼——網頁布局典型範例

11.1 
使用CSS排版      230

11.1.1案例1——將頁面用DIV分塊        230

11.1.2案例2——設置各塊位置        230

11.1.3案例3——用CSS定位    230

11.2 
固定寬度網頁剖析與布局 233

11.2.1案例4——網頁單列布局模式        233

11.2.2案例5——網頁1-2-1型布局模式 237

11.2.3案例6——網頁1-3-1型布局模式 240

11.3 
自動縮放網頁1-2-1型布局模式        244

11.3.1案例7——“1-2-1”等比例變寬布局   244

11.3.2案例8——“1-2-1”單列變寬布局        245

11.4 
自動縮放網頁1-3-1型布局模式        246

11.4.1案例9——“1-3-1”三列寬度等比例布局   246

11.4.2案例10——“1-3-1”單側列寬度固定的

     
       變寬布局       246

11.4.3案例11——“1-3-1”中間列寬度固定的

          變寬布局         249

11.4.4案例12——“1-3-1”雙側列寬度固定的

            
變寬布局       252

11.4.5案例13——“1-3-1”中列和側列寬度

            
固定的變寬布局  255

11.5 
實戰演練——使用CSS設定網頁布局

         
列的背景色         258

11.6 
高手甜點      259

11.7 
跟我練練手 260

第12章讓網頁更絢麗——在網頁中編寫JavaScript

12.1 
認識JavaScript    262

12.1.1什麼是JavaScript     262

12.1.2JavaScript的特點     262

12.2 
JavaScript 在HTML中的使用    263

12.2.1案例1——在HTML網頁頭中嵌入

              JavaScript代碼   263

12.2.2案例2——在HTML網頁中嵌入

              JavaScript代碼   264

12.2.3案例3——在HTML素事件中嵌

            
入JavaScript代碼         265

12.2.4案例4——在HTML中調用已經存在的

              JavaScript文件   266

12.2.5案例5——通過JavaScript偽URL引入

              JavaScript腳本代碼   267

12.3JavaScript的基本語法         268

12.3.1執行順序  268

12.3.2區分大小寫       268

12.3.3分號與空格       268

12.3.4對代碼行進行折行  269

12.3.5案例6——注釋        269

12.4 
JavaScript 的數據結構        270

12.4.1標識符       270

12.4.2關鍵字       271

12.4.3保留字       271

12.4.4常量  272

12.4.5變量  272

12.5案例7——使用函數  274

12.6 
JavaScript的常用事件         275

12.6.1案例8——頁面事件        275

12.6.2案例9——鼠標事件        276

12.6.3案例10——鍵盤事件      277

12.6.4案例11——表單處理事件      279

12.7 
實戰演練——使用事件動態改變圖片

          
的焦點       281

12.8 
高手甜點      282

12.9 
跟我練練手 282

第13章讓別人瀏覽我的成果——網站的發布

13.1上傳網站前的準備工作      284

13.1.1注冊域名  284

13.1.2申請空間  285

13.2 
測試網站      286

13.2.1案例1——測試站點範圍的鏈接   286

13.2.2案例2——改變站點範圍的鏈接   286

13.2.3案例3——查找和替換   287

13.2.4案例4——清理文檔        288

13.3 
上傳網站      289

13.3.1案例5——使用Dreamweaver
CC上傳網站 289

13.3.2案例6——使用FTP工具上傳網站         290

13.4 
高手甜點      292

13.5 
跟我練練手 293

第14章整體把握網站結構——網站配色與布局

14.1善用色彩設計網頁      296

14.1.1認識色彩  296

14.1.2案例1——網頁上的色彩處理        297

14.2 
網頁色彩的搭配 300

14.2.1案例2——確定網站的主題色        300

14.2.2案例3——網頁色彩搭配原理        301

14.2.3案例4——網頁中色彩的搭配        303

14.2.4案例5—&mdash素的色彩搭配   304

14.2.5案例6——網頁色彩搭配的技巧   305

14.3 
布局網站板塊結構      306

14.3.1案例7——“國”字型   307

14.3.2案例8——標題正文型   307

14.3.3案例9——左右框架型   307

14.3.4案例10——上下框架型 307

14.3.5案例11——綜合框架型 308

14.3.6案例12——封面型 308

14.3.7案例13——Flash型         308

14.4 
網站配色應用案例      308

14.4.1案例14——網絡購物網站色彩應用      308

14.4.2案例15——遊戲網站色彩應用      309

14.4.3案例16——企業門戶網站色彩應用      310

14.4.4案例17——時政新聞網站色彩應用      311

14.4.5案例18——影音視頻網站色彩應用      311

14.4.6案例19——電子商務網站色彩應用      312

14.4.7案例20——娛樂網站色彩應用      312

14.5實戰演練——定位網站頁面的框架 313

14.6高手甜點      314

14.7 
跟我練練手 314

第4篇  行業應用案例

第15章行業綜合案例1——制作電子商務類網頁

15.1 
整體布局      318

15.1.1設計分析  318

15.1.2排版架構  318

15.2 
模塊組成      319

15.3 
制作步驟      319

15.3.1樣式表       319

15.3.2網頁頭部  325

15.3.3主體通欄  328

15.3.4主體第二通欄  328

15.3.5主體第三通欄  329

15.3.6網頁底部  331

第16章行業綜合案例2——制作網上音樂類網頁

16.1 
構思布局      336

16.1.1設計分析  336

16.1.2排版架構  336

16.2 
模塊分割      338

16.2.1頁頭部分  338

16.2.2左側內容列表  340

16.2.3中間內容列表  342

16.2.4右側內容列表  344

16.2.5頁腳部分  346

16.3 
整體調整      346

16.3.1頁面內容主體調整  346

16.3.2頁面整體調整  347

第17章行業綜合案例3——制作休閑娛樂類網頁

17.1 
整體布局      350

17.1.1設計分析  350

17.1.2排版架構  351

17.2 
模塊組成      351

17.3 
制作步驟      352

17.3.1制作樣式表       352

17.3.2Logo與導航菜單      359

17.3.3搜索條       359

17.3.4左側視頻模塊  360

17.3.5評論模塊  361

17.3.6右側熱門推薦  362

17.3.7底部模塊  365

第18章行業綜合案例4——制作移動設備類網頁

18.1 
網站設計分析      368

18.2 
網站結構分析      368

18.3 
網站主頁面的制作      369

18.4 
網站成品預覽      370

第5篇  全能拓展

第19章增加點擊率——網站優化與推廣

19.1 
在網站中添加廣告      380

19.1.1網站廣告分類  380

19.1.2添加網站廣告  381

19.2添加實用查詢工具      382

19.2.1添加天氣預報  382

19.2.2添加IP查詢      383

19.2.3添加萬年歷       383

19.2.4添加列車時刻查詢  384

19.3 
網站的宣傳與推廣      385

19.3.1網站宣傳實用策略  385

19.3.2利用大眾傳媒進行推廣  386

19.3.3利用網絡媒介進行推廣  386

19.3.4利用其他形式進行推廣  388

19.4 
實戰演練——查看網站的流量 388

19.5 
高手甜點      391

19.6 
跟我練練手 391

第20章打造堅實的堡壘——網站安全與防御

20.1 
網站維護基礎知識      394

20.1.1網站的維護與安全  394

20.1.2常見的網站攻擊方式       395

20.2 
網站安全防御策略      396

20.2.1案例1——檢測上傳文件的安全性        396

20.2.2案例2——設置網站訪問權限        397

20.3 
高手甜點      399

20.4 
跟我練練手 400