引入《Web 前端開發職業技能等級標準》的考點，案例豐富、突出實踐

詳細介紹Web 前端開發中涉及的HTML 和CSS 的內容及技巧

大部分案例代碼配有運行結果圖，效果直觀、易于理解

通過各種案例將理論知識與實踐操作結合起來

突出技能訓練，符合1+X 精神

新一輪科技革命與信息技術革命的到來，推動了產業結構調整與經濟轉型升級發展新業態的出現。戰略型新興產業的快速爆發式發展對新時代產業人才的培養提出了新的要求與挑戰。目前，企業對Web前端開發工程師的需求量極大，全國總缺口每年近百萬人。隨著移動互聯網技術的高速發展，網站在靜態頁面的基礎上添加了各類桌面軟件，網頁不再只承載單一的文字和圖片，而且要求具備炫酷的頁面交互和跨終端的適配兼容功能，使用富媒體使網頁內容更加生動，從而讓用戶有更好的使用體驗，這些都是基于Web前端技術來實現的。

“網頁設計與制作”是Web前端技術的基礎，也是計算機專業課程體系中的專業基礎課，其涉及的內容和技術是應用面比較廣且比較容易學習和掌握的。“網頁設計與制作”是大專院校計算機專業學生的必修課，同時也可以作為非計算機專業學生的選修課或限選課。

本書以《Web前端開發職業技能等級標準》中要求的職業素養和崗位技術技能為重點，以專業技能為模塊，以工作任務為驅動進行編寫，使讀者對Web前端開發的技術體系有更系統、更清晰的認識。

通過本書的學習，初學者可學會并掌握網頁設計和網站開發的實用技能。全書共分8章，內容涉及網頁設計基礎知識、網頁制作工具Dreamweaver、文本與文檔、圖像和多媒體、超鏈接、表格和層、表單及CSS等。本書知識全面、概念清晰，以實用為目的，通過淺顯易懂的知識講解，再配以典型案例進行知識技能的強化，使讀者容易掌握內容，使學習不再枯燥。

本書主要有以下幾方面特色。

1．引入《Web前端開發職業技能等級標準》的考點

以《Web前端開發職業技能等級標準》的考點為知識點，以項目案例為載體，系統講解考取Web前端開發職業技能等級證書所需的知識考點和技能考點。

2．內容全面，由淺入深

本書詳細介紹了Web前端開發中涉及的HTML和CSS的內容和技巧，并重點講解了學習過程中難以理解和掌握的知識點，降低了讀者的學習難度。

3．理論和實踐相結合

本書每章都配有一定數量的實用案例，在全面、系統介紹各章知識內容的基礎上，還提供了可以整合綜合知識的案例。通過各種案例將理論知識和實踐結合起來。

4．圖文并茂

本書的案例代碼大部分都配有相應的運行結果圖，效果直觀，使讀者可以獲得感性認識，提高學習效率。

本書非常適合初學者學習和使用，可作為普通高校、高等職業院校“網頁設計與制作”課程的教學用書，同時，也可作為相關學科的培訓教材和從事網頁設計、網站開發及網站編程人員的自學指導書和參考書。

本書由黑龍江農業職業技術學院李佼輝、聶樹成任主編，欒奕娜、車延雪、任雪冬任副主編，王樹軍任主審，趙金利任參編并參與了部分章節的編寫工作。本書的第1、2、8章由李佼輝編寫，第3章及附錄由欒奕娜編寫，第4章由任雪冬編寫，第5、6章由聶樹成編寫，第7章由車延雪編寫。審校工作由王樹軍完成，李佼輝、聶樹成對全書進行了內容統籌、章節結構設計和統稿。在本書編寫過程中，趙金利也提供了一定的幫助。

由于編者水平有限，書中難免存在不足之處，懇請廣大讀者不吝賜教并提出寶貴意見。

前言

第1章 網頁設計基礎知識 1
1.1 互聯網基礎知識 1
1.1.1 Internet與Web 1
1.1.2 URI、URL、URN 2
1.1.3 服務器與瀏覽器 2
1.2 網頁的基礎知識 3
1.2.1 網頁的基本元素 3
1.2.2 靜態網頁 5
1.2.3 動態網頁 5
1.3 常見的網站類型 6
1.4 網頁制作軟件及標準技術 9
1.4.1 常用的網頁制作軟件 9
1.4.2 網頁制作標準技術 10
本章小結 11
第2章 網頁制作工具Dreamweaver 12
2.1 Dreamweaver簡介 12
2.2 DW的基本使用方法 17
本章小結 19
第3章 文本與文檔 20
3.1 網頁文本編輯 20
案例1 制作一個含文本的網頁 20
案例2 給網頁文本編輯樣式 24
實戰1 制作一個百度詩詞頁面 31
實戰2 制作一個騰訊新聞網菜單 31
3.2 網頁文檔編輯 31
案例1 制作“古詩詞譯文”網頁 31
案例2 使用項目編號制作“排行榜”
網頁 36
實戰1 制作“公司簡介”網頁 38
實戰2 制作“美容護膚”網頁 39
本章小結 40
第4章 圖像和多媒體 41
案例1 在網頁中插入圖像 41
案例2 在網頁中插入多媒體 47
實戰1 制作一個寵物狗網店網頁 59
實戰2 制作準媽媽課堂網頁 60
本章小結 60
第5章 超鏈接 61
5.1 超鏈接的基本用法 61
案例1 制作一個文本的超鏈接 61
案例2 制作圖片超鏈接 64
案例3 制作商品信息展示 65
實戰 制作iPhone11商品展示 73
5.2 錨鏈接的應用 73
案例1 制作錨鏈接 74
案例2 制作電子郵件鏈接（在案例1基礎上
完成） 78
5.3 超鏈接的綜合應用 79
案例 制作網頁小說 79
實戰 制作網上教程 84
本章小結 85
第6章 表格和層 86
6.1 表格在網頁中的應用 86
案例1 創建表格 86
案例2 跨行、跨列的表格 89
案例3 制作表格圖文混排—商品展示欄
頁面 93
實戰1 制作學生成績表 95
實戰2 進行簡單的圖文混排 96
6.2 層布局 96
案例1 簡單的層布局 96
案例2 使用混合布局實現家裝網站 104
實戰 混合布局 108
本章小結 109
第7章 表單 110
案例1 用戶注冊網頁 110
案例2 會員注冊網頁 122
實戰1 用戶注冊頁面 138
實戰2 健康測試網頁 139
實戰3 國際航空網頁 140
本章小結 140
第8章 CSS 141
8.1 CSS選擇器 141
案例1 標簽選擇器 141
案例2 類選擇器 145
案例3 ID選擇器 148
案例4 背景及偏移量 151
實戰1 文本屬性樣式 156
實戰2 背景屬性 156
8.2 CSS的應用及優先級 156
案例1 外部樣式表 156
案例2 行內樣式表 161
案例3 樣式表優先級 163
案例4 CSS優先級 165
本章小結 170
Web前端開發（1+X）考試的考點知識 171
Web前端開發初級（1+X）理論考試樣題 176
Web前端開發初級（1+X）實操考試樣題 182
Web前端開發初級（1+X）理論考試樣題答案 194
Web前端開發初級（1+X）實操考試樣題答案 195
參考文獻 197

1. 輸水管線工程風險管理 [張勇 黨亥生 著]
2. 民用航空飛機標準線路施工 [主編　王志敏　陳明]
3. 不息的水脈—大運河講談錄 [趙珩　著]
4. 實用運籌學 [主編　邢育紅　于晉臣]
5. 三峽梯級電站水資源決策支持系統研究與開發 [姚華明 潘紅忠 湯正]
6. 海南黎族民俗文化鑒賞 [龐國華　著]
7. 石墨烯在太赫茲及中紅外頻段電磁器件設計中的應用 [李艷秀 莊華偉 著]
8. 電子技術（第二版） [主編 覃愛娜 李飛]
9. 辦公自動化高級應用 [陳萍 朱曉玉]
10. 信息處理技術員考試32小時通關 [薛大龍]
11. 電子產品設計案例教程（微課版）—基于嘉立創EDA（專業版） [王靜 莫志宏 陳學昌 丁紅]
12. C程序設計實踐教程 [劉衛國]
13. C程序設計（慕課版） [劉衛國]
14. Web技術開發教程（基于.NET開源MVC框架） [王合闖 韓紅玲 王青正 陳海蕊]
15. 商務英語翻譯教程（筆譯）（第四版） [主編 王軍平]
16. 智慧零售技術與應用 [洪旭 著]
17. 建設工程法規實務 [主編 余瀅]
18. 商務秘書理論與實務（第三版） [主編 張同欽]
19. 程序設計基礎實踐教程（C/C++語言版） [張桂芬 葛麗娜]
20. C++案例項目精講 [主編 楊國興]
21. 勞動爭議處理實務 [主編 王秀卿 羅靜]
22. 工程數學 [主編 郭立娟 王海]
23. 語音識別理論與實踐 [主編　莫宏偉]
24. 信息系統項目管理師章節習題與考點特訓（第二版） [主編 薛大龍]
25. 武術基礎教程 [主編 李代勇 謝志民]
26. 計算機網絡實訓教程 [主編 張浩軍 趙玉娟]
27. 畫法幾何與機械制圖習題集（多學時） [主編 趙軍]
28. HCIA-Datacom認證題庫分類精講 [主 編 韓立剛]
29. SwiftUI完全開發 [李智威 著]
30. 網絡規劃設計師備考一本通 [夏杰 編著]