Dreamweaver CS6網頁設計實例教程

《Dreamweaver CS6網頁設計實例教程》是2017年7月清華大學出版社出版的圖書，作者是李曉歌、許朝俠、王輝、朱坤華、焦陽。

基本介紹

• 書名：Dreamweaver CS6網頁設計實例教程
• 作者：李曉歌、許朝俠、王輝、朱坤華、焦陽
• ISBN：9787302472841
• 定價：46元
• 出版社：清華大學出版社
• 出版時間：2017年7月

內容簡介

本書介紹了運用Dreamweaver CS6進行網頁設計的基本方法和常用技巧。全書共分為12個項目。項目1、項目2介紹網頁設計的基本知識，使讀者理解網頁設計的相關概念，掌握網頁設計的基本步驟和流程；項目3～項目8介紹用Dreamweaver CS6布局網頁的常用方法，主要包括傳統的表格布局方法、框架布局方法、目前常用的CSS+DIV布局方法，以及使用流體格線布局進行回響式設計的方法；項目9介紹網頁中常見的特效行為的製作方法；項目10介紹表單的相關知識；項目11介紹模板的製作和使用方法；項目12詳細介紹一個網站開發的綜合實例。

本書既適合作為高職高專院校、培訓機構網頁設計方面的教學用書，也適合作為網頁設計愛好者的自學用書。

圖書目錄

項目1網頁設計基礎/1

任務1.1認識網頁1

1.1.1網頁的分類1

1.1.2網頁設計常用術語2

1.1.3網站開發流程5

任務1.2了解HTML5

1.2.1什麼是HTML5

1.2.2用HTML編寫自己的第一個網頁6

1.2.3HTML中的常用標籤符號7

任務1.3Dreamweaver CS6的安裝與使用11

1.3.1安裝Dreamweaver CS611

1.3.2使用Dreamweaver CS615

1.3.3用Dreamweaver CS6建立一個網頁16

項目小結20

項目實訓20

實訓1.1用HTML建立歡迎頁面20

實訓1.2用Dreamweaver CS6建立歡迎頁面21

項目2建立及管理網站/22

任務2.1在計算機上建立本地網站22

2.1.1建立“我的第一個網站”23

2.1.2本地站點的管理24

2.1.3管理和編輯本地站點檔案27

任務2.2發布網站29

2.2.1網站空間29

2.2.2設定遠程伺服器30

2.2.3上傳網站33

任務2.3網站的更新和維護33

2.3.1本地和遠程資料夾的結構33

〖2〗〖3〗〖4〗2.3.2下載站點中的檔案34

2.3.3本地檔案和遠程檔案的同步34

項目小結35

項目實訓35

實訓2.1為站點申請空間35

實訓2.2建立並上傳網站“我的家”35

項目3向網頁中添加各種元素/37

任務3.1向網頁中添加文本37

3.1.1案例導入——建立“班級簡介”網頁37

3.1.2在Dreamweaver 中創建普通文本38

3.1.3一些特殊文本的輸入41

3.1.4文本的常用格式設定41

3.1.5觀察文本對應的代碼44

任務3.2向網頁中添加圖像45

3.2.1案例導入——建立“汽車之家”網頁45

3.2.2網頁中常用的圖像格式45

3.2.3插入圖像46

3.2.4給無法顯示的圖像加注釋48

3.2.5圖像的編輯48

3.2.6觀察圖像對應的代碼50

任務3.3向網頁中添加聲音50

3.3.1案例導入——建立“音樂播放”網站51

3.3.2向網頁中插入可控制播放的聲音51

3.3.3在網頁中套用背景聲音54

任務3.4向網頁中添加視頻55

3.4.1案例導入——建立“視頻播放”網頁56

3.4.2向網頁中添加Flash動畫56

3.4.3向網頁中添加FLV視頻59

3.4.4向網頁中添加其他視頻檔案60

3.4.5觀察各種插入視頻的方法對應的代碼60

項目小結62

項目實訓63

實訓3.1建立文字編輯網頁63

實訓3.2建立“香香美食”網63

項目4實現網頁的超連結/64

任務4.1認識超連結64

4.1.1超連結的分類64

4.1.2超連結的路徑64

任務4.2創建內部超連結65

4.2.1案例導入——設定“九寨溝四季”系列頁面的內部超連結65

4.2.2創建文字超連結65

4.2.3創建圖像超連結66

4.2.4滑鼠經過圖像連結69

4.2.5觀察連結對應的代碼71

4.2.6設定“九寨溝四季”系列頁面的內部超連結72

任務4.3創建錨記連結73

4.3.1案例導入——設定“插花藝術”網頁的錨記連結73

4.3.2創建命名錨記73

4.3.3連結到命名錨記74

4.3.4創建虛連結74

4.3.5觀察錨記連結對應的代碼74

4.3.6設定“插花藝術”網頁的錨記連結74

任務4.4創建其他超連結76

4.4.1案例導入——向“九寨溝四季”網頁添加超連結76

4.4.2創建外部超連結76

4.4.3創建Email連結77

4.4.4創建下載檔案超連結77

4.4.5創建腳本連結78

4.4.6為“九寨溝四季”網頁添加外部和電子郵件等連結78

任務4.5編輯超連結80

4.5.1設定超連結的外觀80

4.5.2刪除超連結80

項目小結81

項目實訓81

實訓4.1製作“犬類美容”網頁的導航條81

實訓4.2製作“黃山四絕”系列頁面81

項目5用表格布局頁面/82

任務5.1表格的基本操作82

5.1.1案例導入——製作“經典電影TOP 10”網頁82

5.1.2創建表格82

5.1.3調整表格的結構84

5.1.4表格輸入內容87

5.1.5利用屬性面板設定表格的外觀效果87

5.1.6觀察表格對應的代碼88

5.1.7製作“經典電影TOP 10”網頁89

任務5.2表格中的數據處理91

5.2.1案例導入——製作“各專業畢業生統計”網頁91

5.2.2數據的導入與導出92

5.2.3數據的排序94

5.2.4製作“各專業畢業生統計”網頁96

任務5.3使用表格布局網頁100

5.3.1案例導入——製作“畢業生就業信息網”首頁100

5.3.2嵌套表格100

5.3.3表格製作技巧101

5.3.4表格布局網頁的設計要點102

5.3.5製作“畢業生就業信息網”首頁103

項目小結107

項目實訓107

實訓5.1製作“信息工程系圖形圖像112班課程表”網頁107

實訓5.2製作“花影襲人”網站中“菊花簡介”的網頁108

實訓5.3製作“信息工程系教學評估網”首頁108

項目6用框架布局頁面/110

任務6.1創建框架網頁110

6.1.1案例導入——製作“信息系課程表”網頁110

6.1.2認識框架網頁110

6.1.3創建框架網頁111

6.1.4保存框架網頁112

6.1.5觀察框架集檔案對應的代碼116

6.1.6製作“信息系課程表”框架網頁117

任務6.2框架和框架集的基本操作119

6.2.1案例導入——製作“花卉護理——牡丹”網頁119

6.2.2選擇框架和框架集120

6.2.3編輯框架集的屬性120

6.2.4編輯框架的屬性121

6.2.5調整框架的大小122

6.2.6刪除框架（合併框架）122

6.2.7製作“花卉護理——牡丹”網頁122

任務6.3設定框架網頁的連結125

6.3.1框架內的連結125

6.3.2關鍵字的連結126

項目小結127

項目實訓128

實訓6.1製作“暗香盈袖”網站的系列網頁128

實訓6.2製作“心情驛站”個人部落格首頁129

項目7用CSS美化網頁/130

任務7.1認識CSS130

7.1.1案例導入——對“影迷俱樂部”網站中的網頁套用CSS130

7.1.2打開“新建CSS規則”的幾種方法133

7.1.3CSS常用屬性134

任務7.2建立和管理CSS樣式140

7.2.1建立可套用於任何HTML元素的CSS樣式140

7.2.2建立套用於一個HTML元素的CSS樣式142

7.2.3建立套用於指定標籤的CSS樣式144

7.2.4建立套用於指定範圍內標籤的CSS樣式146

7.2.5建立套用於多個標籤的CSS樣式147

7.2.6建立定義超連結的CSS樣式149

7.2.7觀察CSS樣式對應的代碼151

7.2.8用“CSS樣式”面板管理CSS樣式151

任務7.3建立並套用外部CSS樣式154

7.3.1建立外部CSS樣式定義頁面文字和背景154

7.3.2在一個網頁中套用已建好的外部樣式157

任務7.4CSS常見套用158

7.4.1用CSS控制段落樣式158

7.4.2用CSS控制圖片樣式160

7.4.3用CSS控制背景圖片的樣式162

7.4.4用CSS美化列表163

7.4.5套用CSS濾鏡164

項目小結166

項目實訓167

實訓7.1為“影迷俱樂部”網站中的網頁設定格式167

實訓7.2設定“茶文化”網頁167

實訓7.3設定“新聞公告”網頁168

項目8用CSS+DIV布局頁面/169

任務8.1認識DIV與CSS盒模型169

8.1.1<div>標籤169

8.1.2CSS盒模型171

任務8.2套用CSS實現定位175

8.2.1CSS的定位方式175

8.2.2相對定位175

8.2.3絕對定位177

8.2.4固定定位178

8.2.5浮動180

8.2.6清除浮動181

任務8.3CSS+DIV布局實例183

8.3.1案例導入——個人部落格頁面183

8.3.2用CSS+DIV布局網頁的步驟183

8.3.3用CSS+DIV布局個人部落格網頁184

任務8.4實現回響式網頁設計194

8.4.1案例導入——回響式網頁設計： 佳莓生態食品194

8.4.2Dreamweaver CS6中的流體格線布局194

8.4.3製作“佳莓生態食品”網頁196

項目小結204

項目實訓204

實訓8.1了解Dreamweaver CS6中的預設布局204

實訓8.2用CSS+DIV布局“園林設計”網頁205

實訓8.3實現回響式頁面設計205

項目9向網頁添加行為/206

任務9.1了解行為206

9.1.1認識行為206

9.1.2附加行為207

任務9.2使用Dreamweaver CS6內置的行為209

9.2.1用“行為”面板實現交換圖像行為209

9.2.2製作頁面打開時彈出廣告信息210

9.2.3“打開瀏覽器視窗”行為211

9.2.4製作可移動的面板212

9.2.5下拉選單的製作213

9.2.6為元素添加特殊的動畫效果215

任務9.3JavaScript行為的套用216

9.3.1認識JavaScript216

9.3.2調用JavaScript216

9.3.3單擊按鈕背景顏色變換217

9.3.4添加到收藏夾和設為首頁219

9.3.5在網頁中嵌入JavaScript腳本220

9.3.6JavaScript腳本在文檔中的位置221

9.3.7實現懸浮廣告特效222

9.3.8實現滾動圖片特效223

9.3.9實現滑鼠跟隨特效225

項目小結226

項目實訓226

實訓9.1製作下拉選單226

實訓9.2實現JavaScript特效226

實訓9.3給校園新聞網添加行為226

項目10製作表單/228

任務10.1認識表單228

10.1.1案例導入——製作“註冊會員申請”頁面228

10.1.2插入表單和表單對象228

10.1.3設定常用表單對象的屬性231

10.1.4用CSS美化表單238

任務10.2使用Spry構件241

10.2.1案例導入——製作“驢友會員申請”頁面241

10.2.2Spry構件的基本操作242

10.2.3設定常用Spry構件的屬性243

任務10.3練習布局頁面時常用的Spry構件249

10.3.1案例導入——製作“QQ好友”頁面249

10.3.2使用Spry選項卡式面板250

10.3.3使用Spry摺疊式面板251

10.3.4Spry可摺疊面板252

10.3.5使用Spry選單欄252

項目小結254

項目實訓254

實訓10.1利用表單製作個人簡介頁面254

實訓10.2利用Spry驗證表單製作個人註冊頁面254

實訓10.3利用Spry頁面布局構件製作頁面導航255

項目11模板和庫的套用及資源管理/256

任務11.1模板的套用256

11.1.1案例導入——製作“畢業生就業信息網”就業指導系列網頁256

11.1.2認識模板256

11.1.3創建模板258

11.1.4定義模板區域259

11.1.5使用模板製作“畢業生就業信息網”就業指導系列網頁262

11.1.6更新模板及模板的其他操作268

任務11.2定製庫項目270

11.2.1案例導入——定製畢業生就業信息網的庫項目270

11.2.2認識庫270

11.2.3庫項目的套用270

11.2.4定製畢業生就業信息網庫項目272

任務11.3資源管理274

11.3.1資源類型274

11.3.2“資源”面板275

項目小結275

項目實訓275

實訓11.1為“中原線上”網站設計模板，並套用模板創建系列網頁275

實訓11.2自行設計創建所在院系網站275

項目12網站製作實例/277

任務12.1網站布局規劃分析277

12.1.1案例導入——製作海南旅遊網站277

12.1.2網頁布局規劃277

任務12.2製作主頁279

12.2.1頁面的全局布局279

12.2.2製作logo部分282

12.2.3製作上部導航欄282

12.2.4製作主體內容區284

12.2.5製作彈出式子選單287

12.2.6製作圖片循環播放效果288

12.2.7製作版權資訊部分並使用分隔線289

任務12.3製作子頁290

12.3.1進行頁面的全局布局290

12.3.2布局主體內容區292

12.3.3製作主體內容區左側圖片連結292

12.3.4製作主體內容區右側連結294

參考文獻/296