任務(wù)驅(qū)動：以網(wǎng)站設(shè)計與開發(fā)的工作任務(wù)為主線，按項目化教學(xué)方式編排。

目標(biāo)明確：每個任務(wù)給出明晰的知識目標(biāo)和能力目標(biāo)。

步驟清晰：詳細(xì)講解任務(wù)的實現(xiàn)步驟。

隨著互聯(lián)網(wǎng)技術(shù)的高速發(fā)展，移動智能設(shè)備的使用變得普遍，人們可以隨時隨地獲取信息和服務(wù)，而網(wǎng)頁作為互聯(lián)網(wǎng)的信息載體之一，可以為用戶帶來直觀的、全面的體驗。HTML5和CSS3是Web前端開發(fā)的最新技術(shù)，大部分瀏覽器已支持HTML5和CSS3技術(shù)。HTML5是最新的HTML標(biāo)準(zhǔn)，是專門為承載豐富的Web內(nèi)容而設(shè)計的，并且無需額外插件，它擁有新的語義、圖形和多媒體等元素。CSS3在原有基礎(chǔ)上增加了更多的CSS選擇器和更多實用的高級屬性，可以實現(xiàn)更簡單但更為強大的頁面效果和網(wǎng)頁交互功能。在目前網(wǎng)頁制作行業(yè)中，HTML5與CSS3技術(shù)以它們獨有的優(yōu)點在業(yè)內(nèi)得到了廣泛應(yīng)用。

HTML5和CSS3技術(shù)作為前端開發(fā)的入門技術(shù)，是Web前端開發(fā)技術(shù)人員必須扎實掌握的職業(yè)技能，也是高職高專院校相關(guān)專業(yè)學(xué)生應(yīng)該熟練掌握的技術(shù)。本書是針對高職高專院校互聯(lián)網(wǎng)應(yīng)用技術(shù)專業(yè)學(xué)生的培養(yǎng)目標(biāo)進(jìn)行編寫的，注重學(xué)生職業(yè)能力與職業(yè)技能的培養(yǎng)，通過本書的學(xué)習(xí)，學(xué)生可以熟練掌握HTML5+CSS3前端開發(fā)基礎(chǔ)知識與應(yīng)用。本書還參考了《Web前端開發(fā)職業(yè)技能等級標(biāo)準(zhǔn)》，重構(gòu)并序化了教學(xué)內(nèi)容，以項目為載體，結(jié)合教材內(nèi)容合理地安排教學(xué)任務(wù)。本書分為基礎(chǔ)項目與綜合項目，其中，基礎(chǔ)項目主要包括文本類網(wǎng)頁、列表類網(wǎng)頁、超鏈接網(wǎng)頁、表格類網(wǎng)頁、表單類網(wǎng)頁、綜合布局網(wǎng)頁、動畫效果網(wǎng)頁；綜合項目包括網(wǎng)站設(shè)計與制作的準(zhǔn)備、網(wǎng)站首頁、二級頁面、三級頁面的制作。

全書內(nèi)容以項目化教學(xué)的方式進(jìn)行編排，全面系統(tǒng)地闡述了HTML5和CSS3的基礎(chǔ)知識和實際運用技術(shù)。本書以任務(wù)驅(qū)動的方式安排教學(xué)內(nèi)容，將每個項目按工作流程分為若干任務(wù)，每個任務(wù)又設(shè)計了以下幾個模塊：

· 任務(wù)目標(biāo)：明確任務(wù)的知識目標(biāo)和能力目標(biāo)。

· 任務(wù)效果：說明任務(wù)運用的基礎(chǔ)知識及任務(wù)完成的最終效果。

· 相關(guān)知識：提供完成任務(wù)需要掌握的基礎(chǔ)知識和實際運用技術(shù)。

· 實現(xiàn)步驟：詳細(xì)講解任務(wù)的實施步驟。

· 思考與練習(xí)：根據(jù)Web前端開發(fā)初級的1+X證書考點整理出任務(wù)相關(guān)的理論題和操作題。

本書以網(wǎng)站設(shè)計與開發(fā)的工作任務(wù)為主線，內(nèi)容講解詳細(xì)、結(jié)構(gòu)編排科學(xué)、語言通俗易懂，以接近真實的網(wǎng)站項目為依托，知識涵蓋面廣。

本書由河源職業(yè)技術(shù)學(xué)院的譚衛(wèi)老師組織編寫，譚衛(wèi)、徐文義任主編，安華萍、王玉、鐘機(jī)靈、段春梅（佛山職業(yè)技術(shù)學(xué)院）任副主編。在本書編寫過程中，編者參考了相關(guān)技術(shù)的資料文獻(xiàn)、書籍及網(wǎng)絡(luò)資源，在此表示感謝。

由于編者水平有限，書中難免存在疏漏甚至錯誤之處，懇請讀者批評指正，以便進(jìn)一步完善與改進(jìn)，編者E-mail：99150752@qq.com。

前言

項目1 建立文本類網(wǎng)頁 1
任務(wù)1 網(wǎng)頁內(nèi)容構(gòu)建 1
任務(wù)目標(biāo) 1
任務(wù)效果 1
相關(guān)知識 2
實現(xiàn)步驟 18
任務(wù)2 頁面樣式修飾 21
任務(wù)目標(biāo) 21
任務(wù)效果 22
相關(guān)知識 22
實現(xiàn)步驟 37
思考與練習(xí) 39
項目2 建立列表多媒體類網(wǎng)頁 43
任務(wù)1 頁面內(nèi)容構(gòu)建 43
任務(wù)目標(biāo) 43
任務(wù)效果 43
相關(guān)知識 45
實現(xiàn)步驟 55
任務(wù)2 頁面樣式修飾 58
任務(wù)目標(biāo) 58
任務(wù)效果 58
相關(guān)知識 59
實現(xiàn)步驟 70
思考與練習(xí) 73
項目3 建立超鏈接 76
任務(wù)1 頁面內(nèi)容構(gòu)建 76
任務(wù)目標(biāo) 76
任務(wù)效果 76
相關(guān)知識 77
實現(xiàn)步驟 81
任務(wù)2 頁面樣式修飾 84
任務(wù)目標(biāo) 84
任務(wù)效果 85
相關(guān)知識 85
實現(xiàn)步驟 99
思考與練習(xí) 101
項目4 建立表格頁 103
任務(wù)1 案例展示頁制作 103
任務(wù)目標(biāo) 103
任務(wù)效果 103
相關(guān)知識 104
實現(xiàn)步驟 112
任務(wù)2 案例詳情頁制作 116
任務(wù)目標(biāo) 116
任務(wù)效果 117
相關(guān)知識 117
實現(xiàn)步驟 126
思考與練習(xí) 128
項目5 建立表單類網(wǎng)頁 131
任務(wù)1 表單頁建立 131
任務(wù)目標(biāo) 131
任務(wù)效果 131
相關(guān)知識 132
實現(xiàn)步驟 139
任務(wù)2 表單頁驗證 141
任務(wù)目標(biāo) 141
任務(wù)效果 141
相關(guān)知識 142
實現(xiàn)步驟 149
思考與練習(xí) 150
項目6 建立綜合類網(wǎng)頁 154
任務(wù)1 網(wǎng)頁布局 154
任務(wù)目標(biāo) 154
任務(wù)效果 154
相關(guān)知識 155
實現(xiàn)步驟 173
任務(wù)2 網(wǎng)頁頭部與尾部制作 174
任務(wù)目標(biāo) 174
任務(wù)效果 175
相關(guān)知識 175
實現(xiàn)步驟 178
任務(wù)3 網(wǎng)頁主體部分制作 180
任務(wù)目標(biāo) 180
任務(wù)效果 181
相關(guān)知識 181
實現(xiàn)步驟 188
思考與練習(xí) 193
項目7 網(wǎng)頁動畫制作 196
任務(wù)1 過渡效果制作 196
任務(wù)目標(biāo) 196
任務(wù)效果 196
相關(guān)知識 197
實現(xiàn)步驟 204
任務(wù)2 動畫效果制作 204
任務(wù)目標(biāo) 204
任務(wù)效果 205
相關(guān)知識 205
實現(xiàn)步驟 224
思考與練習(xí) 225
項目8 綜合實戰(zhàn)—企業(yè)網(wǎng)站設(shè)計與制作 229
任務(wù)1 網(wǎng)站設(shè)計與制作準(zhǔn)備 229
任務(wù)2 網(wǎng)站首頁制作 234
任務(wù)3 網(wǎng)站二級列表頁面制作 245
任務(wù)4 網(wǎng)站三級內(nèi)容頁面制作 253
思考與練習(xí) 256
參考文獻(xiàn) 257

1. C語言程序設(shè)計實驗指導(dǎo)與實訓(xùn)（第二版） [主編 倪燃]
2. Python程序設(shè)計及實踐教程 [肖朝暉]
3. C語言程序設(shè)計 [魏琴 劉祖珉 趙仕波 肖陽春]
4. C語言程序設(shè)計實驗教程 [張小剛 司春景]
5. 電氣控制與PLC程序設(shè)計（第二版） [胡冠山]
6. Java Web項目化設(shè)計實踐教程 [邱云 曾陳萍]
7. C語言程序設(shè)計（第三版） [主編 丁紅 王立新 蔡開立]
8. Python數(shù)據(jù)分析 [主編　馮志輝　趙磊　李放]
9. Python程序設(shè)計與應(yīng)用（第二版） [主編 張廣淵]
10. C程序設(shè)計實踐教程 [劉衛(wèi)國]
11. C程序設(shè)計（慕課版） [劉衛(wèi)國]
12. 程序設(shè)計基礎(chǔ)實踐教程（C/C++語言版） [張桂芬 葛麗娜]
13. C++案例項目精講 [主編 楊國興]
14. SwiftUI完全開發(fā) [李智威 著]
15. MySQL數(shù)據(jù)庫項目式教程 [陳亞峰]
16. C語言程序設(shè)計習(xí)題與實驗指導(dǎo)（第二版） [主編 甄增榮 張賓]
17. C語言程序設(shè)計（第二版） [主編 甄增榮 田云霞]
18. Unity3D虛擬現(xiàn)實應(yīng)用開發(fā)實踐 [主 編 劉龍]
19. Python程序設(shè)計 [主編 姜春磊 陳虹潔]
20. C語言程序設(shè)計實踐教程（活頁式） [主編 鄭茵 陳巍 滕泓虬]
21. 面向?qū)ο蟪绦蛟O(shè)計 [主編 張勇 張平華 趙小龍]
22. Python程序設(shè)計基礎(chǔ)及實戰(zhàn) [主編　劉健]
23. C語言程序設(shè)計 [姜雪]
24. Python程序設(shè)計實踐教程 [王鶴琴 蔡正保]
25. C++程序設(shè)計實踐教程（第三版） [主編 劉衛(wèi)國 曹岳輝]
26. C++程序設(shè)計（第三版） [主編 曹岳輝 劉衛(wèi)國]
27. C語言程序設(shè)計項目化教程（活頁式） [主編 張利華 潘曉利]
28. 機(jī)器人流程自動化（RPA）實戰(zhàn)——基于UiPath [主編　金鑫]
29. Python 語言程序設(shè)計實踐指導(dǎo) [主編　張雙獅]
30. Python程序設(shè)計案例教程 [主編 毛錦庚 鐘肖英 周賢來 ]