網頁設計與製作案例教程(第3版)

《網頁設計與製作案例教程(第3版)》是2015年出版的圖書,作者是李敏。

圖書信息

作 譯 者:李敏

出版時間:2015-09

千 字 數:518

內容簡介

全書分為16章,第1~2章介紹了網頁、網站建設流程、HTML、網頁版式設計與色彩搭配等基礎知識;第3~14章系統地介紹了網頁設計製作軟體Dreamweaver CS6的功能和設計製作各類網頁的方法技巧;第15~16章以Div+CSS作為技術架構,分別介紹了網站前台設計製作的綜合套用實例,綜合套用實例也可作為實訓周的實訓參考內容。 本書配有豐富的教學資源,書中重要知識要點和操作技能可以通過配套的微課進行學習。通過學習任務和“由簡到繁、由易到難、承前啟後”的階梯式系列案例,使讀者輕鬆地掌握設計製作各類網頁的方法和技能,並起到舉一反三的作用。本書內容組織形式新穎、學習任務明確、操作步驟講解詳盡、重點突出,非常符合高職高專學生的認知規律。  

目錄

第1章 網頁設計與製作基礎 1

1.1 學習任務:認識網頁 1

1.1.1 什麼是網頁 1

1.1.2 網頁類型 2

1.1.3 網頁基本元素 3

1.1.4 網頁製作常用軟體和技術 5

1.2 學習任務:認識網站 7

1.2.1 什麼是網站 7

1.2.2 網址與域名 7

1.2.3 網站建設的一般流程 8

1.3 學習任務:HTML基礎知識 11

1.3.1 HTML簡介 11

1.3.2 HTML的基本語法與結構 12

1.3.3 常用的HTML標籤 14

1.3.4 HTML5.0標籤及屬性 25

1.4 實訓 28

1.4.1 實訓一 使用記事本編輯

簡單的網頁 28

1.4.2 實訓二 製作滾動圖片

連結 28

1.5 習題 29

第2章 網頁版式設計與色彩搭配 32

2.1 案例分析:不同風格網頁作品

欣賞與解析 32

2.2 學習任務:網頁版式設計 34

2.2.1 版式設計概述 35

2.2.2 網頁版式的尺寸和構成

要素 35

2.2.3 網頁的版式設計風格 36

2.2.4 網頁版式設計原則 38

2.2.5 網頁版式設計的視覺流程 38

2.2.6 網頁版式設計的步驟 38

2.3 學習任務:色彩的基本理論及

其視覺效果 39

2.3.1 色彩的基本理論 39

2.3.2 色彩的視覺效果 40

2.4 學習任務:網頁中的色彩及配色 41

2.4.1 網頁色彩 42

2.4.2 網頁中色彩的作用 42

2.4.3 網頁配色原理 42

2.4.4 網頁配色技巧 43

2.5 實訓 44

2.5.1 實訓一 總結不同主題網站的版

式設計及配色 44

2.5.2 實訓二 網頁配色練習 44

2.5.3 實訓三 校友網首頁效果圖

設計 45

2.6 習題 46

第3章 Dreamweaver CS6入門 47

3.1 學習任務:認識中文版

Dreamweaver CS6 47

3.1.1 Dreamweaver CS6的特點 47

3.1.2 Dreamweaver CS6的新增

功能 48

3.1.3 Dreamweaver CS6的安裝

與卸載 49

3.2 學習任務:Dreamweaver CS6

工作區介紹 51

3.2.1 啟動Dreamweaver CS6 51

3.2.2 Dreamweaver CS6工作區布局

介紹 52

3.3 學習任務:規劃與創建站點 57

3.3.1 站點概述 57

3.3.2 規劃站點 56

3.3.3 創建本地站點 57

3.3.4 管理站點 59

3.4 案例:創建歡迎光臨網頁 60

3.4.1 創建網頁文檔 60

3.4.2 設定頁面屬性 62

3.4.3 保存網頁文檔 66

3.4.4 預覽網頁文檔 67

3.5 實訓:製作網上家園歡迎頁面 68

3.6 習題 69

第4章 CSS樣式基礎 70

4.1 學習任務:CSS概述 70

4.1.1 CSS的基本概念 70

4.1.2 使用HTML和CSS格式

化網頁 71

4.1.3 CSS樣式面板 72

4.1.4 CSS基本語法 73

4.1.5 CSS樣式表的引用 74

4.2 學習任務:CSS樣式的創建與

屬性設定 77

4.2.1 創建CSS樣式 77

4.2.2 設定CSS屬性 78

4.2.3 使用CSS樣式面板設定

CSS屬性 85

4.3 學習任務:管理CSS樣式 85

4.3.1 連結或導入外部CSS樣式 86

4.3.2 查看CSS樣式 87

4.3.3 編輯與刪除CSS樣式 87

4.4 案例:使用CSS樣式美化網頁 88

4.5 實訓 91

4.5.1 實訓一 為網頁元素套用

CSS樣式 91

4.5.2 實訓二 新浪新聞頭條 91

4.6 習題 92

第5章 網頁的文本和圖像 94

5.1 案例1:設計唐詩賞析網頁 94

5.1.1 在網頁中添加文本 95

5.1.2 設定項目符號或編號 97

5.1.3 插入特殊字元、水平線

和日期 98

5.1.4 設定文本屬性 100

5.1.5 使用CSS設定段落樣式 103

5.2 學習任務:網頁圖像 104

5.2.1 網頁中常用的圖像格式 105

5.2.2 在網頁中添加圖像 105

5.2.3 設定網頁圖像屬性 106

5.2.4 用CSS設定網頁圖像

樣式 107

5.2.5 用CSS設定網頁的背景

圖像 109

5.2.6 插入圖像占位符和滑鼠

經過圖像 110

5.3 案例2:圖文混排——設計電影介紹

網站頁面 112

5.4 實訓:設計暢銷書介紹網頁 113

5.5 習題 114

第6章 網頁超連結與導航 116

6.1 案例1:設計製作過節樂網頁 116

6.1.1 超連結概述 117

6.1.2 創建各類超連結 118

6.1.3 用CSS設定超連結樣式 122

6.2 案例2:圖像地圖——設計國家地理

網站頁面 123

6.3 學習任務:網頁導航設計 125

6.3.1 網頁導航概述 125

6.3.2 網頁導航分類 126

6.3.3 網頁導航方向 128

6.4 案例3:設計製作網頁導航 129

6.5 實訓:設計製作點點星空

網站頁面 131

6.6 習題 132

第7章 使用表格布局網頁 134

7.1 案例1:設計學生成績單 134

7.1.1 創建表格 135

7.1.2 設定表格屬性 136

7.1.3 編輯表格 137

7.1.4 使用CSS美化表格 140

7.2 學習任務:表格標籤 141

7.2.1 使用表格標籤製作網頁

表格 141

7.2.2 在標籤選擇器中設定表格

的屬性 142

7.3 案例2:使用表格布局圖書

資源網 143

7.3.1 使用表格布局網頁 144

7.3.2 導入Excel文檔 145

7.3.3 使用CSS美化頁面 147

7.4 案例3:設計旅遊信息網 148

7.4.1 使用表格布局頁面 149

7.4.2 在表格中插入網頁元素 149

7.4.3 使用CSS美化頁面 151

7.5 實訓 151

7.5.1 實訓一 設計健康

美食網 151

7.5.2 實訓二 設計時尚

禮品網 152

7.6 習題 155

第8章 使用框架布局網頁 156

8.1 案例1:使用框架布局休閒

音樂網頁 156

8.1.1 認識框架與框架集 157

8.1.2 創建框架和框架集 157

8.1.3 保存框架和框架集 158

8.1.4 向框架中添加內容 159

8.2 學習任務:框架標籤 160

8.3 案例2:使用框架布局校園

論壇頁面 161

8.3.1 選擇框架 162

8.3.2 拆分框架 162

8.3.3 設定框架集和框架屬性 163

8.3.4 在框架中添加頁面內容 164

8.3.5 通過連結框架製作導航 165

8.3.6 使用CSS美化頁面 166

8.4 案例3:使用浮動框架布局寶貝

相冊網頁 167

8.5 實訓:設計花園式樓盤網頁 169

8.6 習題 171

第9章 使用流體格線布局網頁 173

9.1 學習任務:流體格線布局概述 173

9.2 案例:使用流體格線布局購物網 173

9.2.1 創建流體格線布局 174

9.2.2 創建模組內容 175

9.3 實訓:使用流體格線布局

寵物網 180

9.4 習題 181

第10章 使用Div布局網頁 182

10.1 案例1:使用AP Div布局電影

資訊網頁 182

10.1.1 AP Div概述 183

10.1.2 AP Div屬性面板 183

10.1.3 “AP元素”面板 184

10.1.4 在AP Div中添加

網頁元素 185

10.1.5 使用CSS美化頁面 187

10.2 學習任務:使用CSS+Div布局

網頁基礎 187

10.2.1 AP Div標籤與Div

標籤 188

10.2.2 Div標籤與span標籤 189

10.2.3 盒子模型 190

10.2.4 元素的定位 192

10.2.5 常用CSS+Div布局

版式 193

10.3 案例2:定位在網頁布局中

的套用 197

10.4 案例3:使用CSS+Div布局個人

Blog 199

10.5 實訓 203

10.5.1 實訓一 網頁定位與

布局 203

10.5.2 實訓二 使用Div+CSS布局

頁面 204

10.6 習題 205

第11章 多媒體網頁與網頁

特效設計 207

11.1 學習任務:在網頁中插入多

媒體對象 207

11.1.1 插入Flash動畫 207

11.1.2 添加聲音 210

11.1.3 插入FLV視頻 211

11.2 學習任務:認識行為 212

11.2.1 行為概述 213

11.2.2 動作與事件 214

11.2.3 添加行為 216

11.3 學習任務:使用行為創建

網頁特效 217

11.3.1 製作網頁載入時彈出

公告頁 217

11.3.2 使用行為設定圖像

特效 218

11.3.3 使用行為設定狀態欄

文本 220

11.3.4 使用行為設定跳轉選單

效果 222

11.4 實訓 224

11.4.1 實訓一 為寶貝相冊網頁

添加背景音樂 224

11.4.2 實訓二 設定變換圖像的

導航欄 224

11.5 習題 225

第12章 使用表單對象 227

12.1 學習任務:表單和表單對象 227

12.1.1 表單 227

12.1.2 表單對象 229

12.2 案例1:設計網頁中的留言簿 231

12.2.1 留言簿界面設計 231

12.2.2 創建文本域 233

12.2.3 創建按鈕 235

12.2.4 使用CSS樣式美化留言

簿網頁 236

12.3 案例2:設計會員註冊頁面 237

12.3.1 會員註冊界面設計 237

12.3.2 創建單選按鈕 239

12.3.3 創建複選框 241

12.3.4 創建列表選單 241

12.4 案例3:在網頁中使用Spry

布局對象 243

12.4.1 插入Spry選單欄 244

12.4.2 插入Spry選項卡式

面板 245

12.4.3 插入Spry摺疊式控制項 246

12.4.4 插入Spry可摺疊面板

控制項 247

12.5 實訓 248

12.5.1 實訓一 設計網上報名

頁面 248

12.5.2 實訓二 設計客戶調查

頁面 249

12.6 習題 250

第13章 創建基於模板的網頁 252

13.1 案例1:創建基於模板的時尚

禮品網 252

13.1.1 模板概述 252

13.1.2 創建模板 253

13.1.3 定義模板的可編輯

區域 256

13.1.4 創建基於模板的網頁 257

13.1.5 管理模板 258

13.2 案例2:套用庫項目 260

13.2.1 庫概述 260

13.2.2 創建庫項目 261

13.2.3 在網頁中套用庫項目 262

13.2.4 更新庫項目 263

13.3 實訓:設計製作朱古力網 264

第14章 測試、發布與維護網站 266

14.1 學習任務:測試站點 266

14.1.1 測試瀏覽器的兼容性 266

14.1.2 測試連結 268

14.1.3 使用報告測試站點 269

14.2 學習任務:註冊域名、申請空間

及發布網站 270

14.2.1 註冊域名 270

14.2.2 申請空間 271

14.2.3 發布站點 272

14.3 案例:為網站在Internet

上安個家 273

14.4 學習任務:網站的宣傳 277

14.4.1 提交搜尋引擎 277

14.4.2 友情連結 278

14.4.3 網路廣告 278

14.4.4 郵件廣告 279

14.4.5 使用留言板、部落格 280

14.5 實訓:註冊免費空間並提交

搜尋引擎 280

14.6 習題 280

第15章 綜合套用案例1:設計製作

工作室網站 281

15.1 網站建設流程 281

15.2 網站需求分析 282

15.3 網站原型設計 283

15.3.1 首頁效果圖的作用 283

15.3.2 首頁效果圖的設計 284

15.4 創建站點 285

15.5 網站首頁設計 286

15.5.1 設定固定寬度且

居中版式 286

15.5.2 頂部Banner設計 287

15.5.3 導航欄設計 288

15.5.4 插入Flash動畫 291

15.5.5 最新作品模組設計 292

15.5.6 底部導航欄設計 293

15.5.7 版權資訊模組設計 294

15.6 欄目頁設計 294

15.7 type.css參考代碼 295

第16章 綜合套用案例2:設計製作

企業類網站 301

16.1 規劃網站首頁的布局 301

16.1.1 網站首頁的布局 302

16.1.2 搭建首頁頁頭的DIV 303

16.1.3 搭建“公司簡介”部分的DIV 304

16.1.4 首頁主體部分的DIV 305

16.2 欄目頁設計 307

16.2.1 Flash動畫展示部分的DIV 309

16.2.2 搭建“產品系列”部分

的DIV 310  

相關詞條

熱門詞條

聯絡我們