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

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

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

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

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

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

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

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

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

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

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

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

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

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

前言

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

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