前 言
一、學習網站制作的意義
隨著互聯(lián)網的發(fā)展，人們的生活、學習、娛樂、購物都越來越多地離不開網絡，而網站是互聯(lián)網上一個重要的“溝通工具”，人們可以通過網站來發(fā)布自己想要的信息，或者利用網站來獲得相關的服務等。其中最常用的功能有如下幾個。
1. 企業(yè)宣傳
企業(yè)宣傳可幫助企業(yè)介紹自己、展示產品種類、整合相關案例等，產品規(guī)格和型號方便潛在客戶隨時查看產品信息。
2. 發(fā)布信息
個人和企事業(yè)單位發(fā)布某個行業(yè)的專業(yè)信息，專一性、專業(yè)性較強，以某個行業(yè)的企業(yè)為中心，整合行業(yè)資源，可形成一個行業(yè)信息專屬平臺。
3. 在線服務
例如，中國移動官網，是一個可以實現(xiàn)在線選擇業(yè)務、提交訂單、在線支付的互動平臺，并且它提供一個意見反饋窗口(在線留言或電子郵件)，用來解答問題和處理用戶意見，從而形成一個友好、便捷的在線服務中心。
4. 論壇社區(qū)
論壇社區(qū)是為業(yè)內人士、專家、學者和普通大眾提供討論和發(fā)表看法的場所，如知乎、天涯等。
為適應社會的需求，目前，網頁設計與制作已經成為眾多高校計算機專業(yè)及越來越多的非計算機專業(yè)學生必須掌握的基本技能之一，因此各高校紛紛開設了網頁設計及網站制作的相關課程。
二、本書結構
《網頁設計與網站建設實例教程（微課版）》是專門為一線教師、師范院校的學生和專業(yè)從事網頁設計與制作的人員編寫的教材，為便于學習，特設計了如下欄目。
● 跟我學：每個實例都通過“跟我學”輕松學習掌握，其中包括多個“階段框”，將任務進一步細分成若干個更小的任務，以降低閱讀難度。
● 創(chuàng)新園：對所學知識進行多層次的鞏固和強化。
● 知識庫：介紹涉及的基本概念和理論知識，以便深入理解相關知識。
● 小結與習題：對全章內容進行歸納、總結，同時用習題來檢測學習效果。
三、《網頁設計與網站建設實例教程（微課版）》特色
《網頁設計與網站建設實例教程（微課版）》打破傳統(tǒng)寫法，各章節(jié)均以實例入手，逐步深入介紹網頁設計與制作、網站建設與制作方法和技巧�！毒W頁設計與網站建設實例教程（微課版）》有以下幾個特點。
● 內容實用：《網頁設計與網站建設實例教程（微課版）》所有實例均選自網頁主要應用領域，內容編排結構合理。
● 圖文并茂：在介紹具體操作步驟過程中，語言簡潔，基本上每一個步驟都配有對應的插圖，用圖文來分解復雜的步驟。路徑式圖示引導，便于讀者一邊翻閱圖書，一邊上機操作。
● 提示技巧：《網頁設計與網站建設實例教程（微課版）》對讀者在學習過程中可能會遇到的問題以“小貼士”和“知識庫”的形式進行了說明，以免讀者在學習過程中走彎路。
● 便于上手：《網頁設計與網站建設實例教程（微課版）》以實例為線索，利用實例將網頁設計與制作技術及網站建設技術串聯(lián)起來，書中的實例都非常典型、實用。
四、《網頁設計與網站建設實例教程（微課版）》資源
為了便于高等院校教師使用，更為了便于高校學生使用，《網頁設計與網站建設實例教程（微課版）》配套相關資源，希望能借助這些資源采用項目學習的方式完成《網頁設計與網站建設實例教程（微課版）》的教學。
● 《網頁設計與網站建設實例教程（微課版）》實例：完整收錄了《網頁設計與網站建設實例教程（微課版）》中每個實例所用到的各種素材，以及初始作品和最終作品。
● 教學課件：為節(jié)省教師的寶貴備課時間，我們制作了教學課件，教師可以適當對其進行修改、完善，以應用到教學中。
● 自學微課：對于相關知識我們制作了微課，讀者在自主學習《網頁設計與網站建設實例教程（微課版）》時，可以掃描對應的二維碼進行自學。
《網頁設計與網站建設實例教程（微課版）》的全部資源可通過掃描下方二維碼下載。
PPT課件+實例文件 自學微課
五、《網頁設計與網站建設實例教程（微課版）》作者
參與《網頁設計與網站建設實例教程（微課版）》修訂編寫的作者有省級教研人員、一線信息技術教師，他們不僅長期從事信息技術教學，而且都有較為豐富的計算機圖書編寫經驗。
《網頁設計與網站建設實例教程（微課版）》由方其桂著，參與編寫的人員還有趙青松、殷小慶、李東亞、周逸、王斌、唐小華、黃金華等。隨書資料由方其桂整理制作。
雖然我們有著十多年撰寫計算機圖書(累計已編寫、出版一百余本)編寫方面的經驗，并盡力認真構思驗證和反復審核修改，但仍難免有一些瑕疵。我們深知一本圖書的好壞，需要廣大讀者去檢驗評說，在這里，我們衷心希望您對《網頁設計與網站建設實例教程（微課版）》提出寶貴的意見和建議。讀者在學習使用過程中，對同樣實例的制作，可能會有更好的制作方法，也可能對書中某些實例的制作方法的科學性和實用性提出質疑，敬請讀者批評指正。
服務電子郵箱：476371891@qq.com。
方其桂
2020年8月
目 錄
第1章 網頁與網站基礎 1
1.1 了解網站 2
1.1.1 網站的概念 2
1.1.2 網站的訪問方式 3
1.1.3 網站的工作過程 4
1.1.4 網站的分類 6
1.1.5 網站的架構 10
1.2 認識網頁 11
1.2.1 網頁的頁面結構 11
1.2.2 網頁中的主要元素 14
1.2.3 網頁的結構類型 17
1.3 初識網頁設計語言與制作工具 19
1.3.1 網頁設計語言 19
1.3.2 網頁制作工具 22
1.3.3 網頁美化工具 23
1.3.4 網頁調試工具 24
1.4 小結和習題 26
1.4.1 本章小結 26
1.4.2 本章練習 26
第2章 網站規(guī)劃設計 29
2.1 網站初步規(guī)劃 30
2.1.1 網站的建設流程 30
2.1.2 網站的設計原則 32
2.1.3 網站的設計技術 33
2.2 網站配色與布局 34
2.2.1 網站配色 34
2.2.2 網站布局 37
2.3 網站內容設計 39
2.3.1 網站主題的定位 39
2.3.2 網站風格的確定 39
2.3.3 網站結構設計 41
2.3.4 網站形象設計 41
2.3.5 網站導航設計 42
2.4 小結和習題 43
2.4.1 本章小結 43
2.4.2 本章練習 44
第3章 初識網頁制作軟件 45
3.1 Dreamweaver工作環(huán)境 46
3.1.1 使用界面 46
3.1.2 浮動面板 47
3.1.3 視圖模式 49
3.2 站點的創(chuàng)建與管理 50
3.2.1 站點的規(guī)劃 50
3.2.2 站點的創(chuàng)建 51
3.2.3 站點的管理 53
3.3 Dreamweaver基本操作 58
3.3.1 新建網頁 58
3.3.2 預覽網頁 59
3.3.3 設置網頁屬性 61
3.4 小結和習題 63
3.4.1 本章小結 63
3.4.2 本章練習 63
第4章 制作網頁內容 65
4.1 輸入文本 66
4.1.1 添加文本 66
4.1.2 美化網頁文本 69
4.1.3 插入列表 72
4.1.4 插入特殊元素 74
4.1.5 插入表格 76
4.2 插入圖像 79
4.2.1 添加圖像 80
4.2.2 設置圖像對齊方式 82
4.2.3 制作鼠標經過圖像 84
4.2.4 添加背景圖像 85
4.3 插入多媒體 87
4.3.1 插入動畫 87
4.3.2 插入視頻 89
4.3.3 插入音頻 90
4.4 使用超鏈接 93
4.4.1 創(chuàng)建超鏈接 93
4.4.2 添加錨鏈接 95
4.5 使用模板快速制作網頁 97
4.5.1 創(chuàng)建模板文件 97
4.5.2 使用模板文件 101
4.5.3 管理模板文件 102
4.6 小結和習題 105
4.6.1 本章小結 105
4.6.2 本章練習 105
第5章 使用CSS樣式美化網頁 107
5.1 了解CSS基礎知識 108
5.1.1 初識CSS樣式 108
5.1.2 編寫CSS樣式 110
5.1.3 引用外部CSS 114
5.2 編寫CSS樣式代碼 117
5.2.1 CSS常用選擇器 117
5.2.2 CSS常用屬性 123
5.3 使用CSS樣式美化文本 127
5.3.1 設置字體屬性 127
5.3.2 設置段落屬性 132
5.4 使用CSS樣式修飾頁面 139
5.4.1 設置圖片樣式 139
5.4.2 設置背景與邊框 144
5.5 小結和習題 148
5.5.1 本章小結 148
5.5.2 本章練習 149
第6章 制作網頁表單 151
6.1 初識表單 152
6.1.1 認識表單對象 152
6.1.2 創(chuàng)建表單 153
6.2 添加表單對象 156
6.2.1 文本域和密碼域 156
6.2.2 文本區(qū)域 158
6.2.3 選擇(列表/菜單) 160
6.2.4 單選按鈕 162
6.2.5 復選框和復選框組 163
6.2.6 按鈕 165
6.2.7 HTML5表單對象 169
6.3 小結和習題 172
6.3.1 本章小結 172
6.3.2 本章練習 172
第7章 規(guī)劃布局網頁 173
7.1 網頁布局基礎知識 174
7.1.1 網頁布局結構 174
7.1.2 網頁布局方法 178
7.1.3 網頁布局技術 179
7.2 使用表格布局網頁 180
7.2.1 插入編輯表格 180
7.2.2 美化設置表格 183
7.2.3 表格布局網頁 188
7.3 使用框架布局網頁 195
7.3.1 了解框架元素及其關系 195
7.3.2 使用iframe元素創(chuàng)建框架頁面 196
7.4 使用DIV+CSS布局 198
7.4.1 兩列結構布局 199
7.4.2 多列結構布局 201
7.5 小結和習題 207
7.5.1 本章小結 207
7.5.2 本章練習 207
第8章 添加網頁特效 211
8.1 使用CSS設計動畫特效 212
8.1.1 設計變換動畫特效 212
8.1.2 設計關鍵幀動畫特效 214
8.1.3 設計過渡動畫特效 217
8.2 使用行為添加網頁特效 219
8.2.1 交換圖像 219
8.2.2 彈出信息 221
8.2.3 打開窗口 222
8.2.4 其他效果 223
8.3 使用框架設置網頁特效 225
8.3.1 設計選項卡特效 225
8.3.2 設計手風琴特效 228
8.4 小結和習題 230
8.4.1 本章小結 230
8.4.2 本章練習 231
第9章 制作動態(tài)網站 233
9.1 安裝和配置IIS 234
9.1.1 安裝IIS 234
9.1.2 配置IIS站點 235
9.2 建立網站數(shù)據庫 241
9.2.1 設計Access網站數(shù)據庫 241
9.2.2 設計MySQL網站數(shù)據庫 244
9.3 制作動態(tài)網頁 248
9.3.1 使用PHP連接數(shù)據庫 249
9.3.2 添加記錄 252
9.3.3 查詢記錄 256
9.3.4 修改記錄 260
9.3.5 刪除記錄 263
9.4 制作動態(tài)網站案例 265
9.4.1 站點分析 265
9.4.2 設計數(shù)據庫 267
9.4.3 制作首頁 269
9.4.4 制作列表頁面 272
9.4.5 制作內容頁面 275
9.4.6 制作管理頁面 276
9.5 小結和習題 279
9.5.1 本章小結 279
9.5.2 本章練習 280
第10章 網站建設與發(fā)布 281
10.1 申請空間和域名 282
10.1.1 申請網站空間 282
10.1.2 注冊域名 285
10.1.3 解析域名 289
10.2 建設網站軟件環(huán)境 291
10.2.1 安裝網絡操作系統(tǒng) 291
10.2.2 搭建網站系統(tǒng)平臺 294
10.2.3 安裝數(shù)據庫管理系統(tǒng) 297
10.3 測試和上傳站點 305
10.3.1 測試瀏覽器兼容性 305
10.3.2 測試鏈接 307
10.3.3 上傳站點 308
10.4 發(fā)布和維護網站 313
10.4.1 發(fā)布網站 313
10.4.2 維護網站 321
10.5 宣傳和推廣網站 321
10.5.1 宣傳網站 322
10.5.2 推廣網站 322
10.6 小結和習題 323
10.6.1 本章小結 323
10.6.2 本章練習 323
書單推薦
