Web前端開發(fā)技術(shù)項(xiàng)目教程
定 價(jià):59.8 元
叢書名:工信精品網(wǎng)站開發(fā)系列教材
- 作者:高鶯 尤瀾濤 蔡黎亞
- 出版時(shí)間:2025/1/1
- ISBN:9787115665225
- 出 版 社:人民郵電出版社
- 中圖法分類:TP393.092.2
- 頁碼:
- 紙張:膠版紙
- 版次:
- 開本:16開
本書以搭建一個(gè)非物質(zhì)文化遺產(chǎn)的網(wǎng)站項(xiàng)目為主線,介紹了HTML5、CSS3、JavaScript及相關(guān)的Web前端開發(fā)技術(shù)。全書共8個(gè)單元、36個(gè)任務(wù),以項(xiàng)目導(dǎo)向、任務(wù)驅(qū)動(dòng)的方式進(jìn)行內(nèi)容介紹,解析網(wǎng)頁制作的知識和技能。本書的8個(gè)單元分別是網(wǎng)頁開發(fā)入門與創(chuàng)建非遺項(xiàng)目站點(diǎn)、創(chuàng)建網(wǎng)頁元素與制作非遺機(jī)構(gòu)介紹頁面和非遺國內(nèi)機(jī)構(gòu)詳情頁面、表格應(yīng)用與制作非遺名錄頁面、HTML5表單與非遺網(wǎng)站登錄頁面和非遺網(wǎng)站注冊頁面的制作、CSS基礎(chǔ)與制作非遺活動(dòng)詳情頁面、CSS高級應(yīng)用與制作非遺項(xiàng)目申報(bào)指南頁面、網(wǎng)頁布局與制作精彩非遺資訊頁面、JavaScript基礎(chǔ)與非遺網(wǎng)站首頁的制作。
本書可以作為應(yīng)用型本科、職業(yè)本科、高職高專院校計(jì)算機(jī)類相關(guān)專業(yè)“Web前端開發(fā)技術(shù)”課程的教材,也可以作為網(wǎng)頁設(shè)計(jì)與制作愛好者和初學(xué)者的自學(xué)參考書。
1. 項(xiàng)目導(dǎo)向,任務(wù)驅(qū)動(dòng),強(qiáng)化技能。本書以非遺網(wǎng)站項(xiàng)目貫穿,劃分為八大模塊來精心組織HTML5、CSS3、JavaScript相關(guān)內(nèi)容。
2. 以崗定標(biāo),崗課直通,學(xué)以致用。對接課程內(nèi)容,增設(shè)項(xiàng)目情景,讓讀者在學(xué)習(xí)過程中了解真實(shí)的工作場景和任務(wù)。
3. 產(chǎn)教融合,強(qiáng)調(diào)實(shí)踐,鼓勵(lì)創(chuàng)新。通過設(shè)計(jì)啟發(fā)性的“邊學(xué)邊思”“技術(shù)辨析”“智海引航”等,為解決實(shí)際問題提供新穎思路和解決方案,培養(yǎng)計(jì)算機(jī)思維和創(chuàng)新思維。
高鶯,碩士研究生,講師/工程師,長期從事前端技術(shù)開發(fā)課程的理論和實(shí)踐教學(xué),指導(dǎo)學(xué)生獲得江蘇省大學(xué)生職業(yè)技能比賽一等獎(jiǎng)1項(xiàng),國賽一等獎(jiǎng)1項(xiàng),江蘇省領(lǐng)航杯大數(shù)據(jù)分析賽項(xiàng)三等獎(jiǎng),獲江蘇省職業(yè)院校技能大賽優(yōu)秀指導(dǎo)教師的稱號。出版教材3部、軟件著作權(quán)3項(xiàng),累計(jì)發(fā)表各類高水平專業(yè)論文10余篇。
單元1 網(wǎng)頁開發(fā)入門與創(chuàng)建非遺項(xiàng)目站點(diǎn) 1
學(xué)習(xí)目標(biāo) 1
情景導(dǎo)入 1
【任務(wù)1.1】認(rèn)識網(wǎng)頁 1
【任務(wù)1.2】建立非遺項(xiàng)目站點(diǎn) 9
【任務(wù)1.3】嘗試制作非遺調(diào)研網(wǎng)頁 20
智海引航 28
【問題1.1】靜態(tài)網(wǎng)頁和動(dòng)態(tài)網(wǎng)頁技術(shù)的應(yīng)用領(lǐng)域 28
【問題1.2】CSS3的新特性 29
匠心獨(dú)運(yùn)——翠微清響 流水高山 30
單元習(xí)題 30
單元2 創(chuàng)建網(wǎng)頁元素與制作非遺機(jī)構(gòu)介紹頁面和非遺國內(nèi)機(jī)構(gòu)詳情頁面 32
學(xué)習(xí)目標(biāo) 32
情景導(dǎo)入 32
【任務(wù)2.1】設(shè)計(jì)非遺機(jī)構(gòu)介紹頁面和非遺國內(nèi)機(jī)構(gòu)詳情頁面 33
【任務(wù)2.2】創(chuàng)建文本元素并制作非遺國內(nèi)機(jī)構(gòu)詳情頁面 34
【任務(wù)2.3】創(chuàng)建超鏈接并插入相關(guān)閱讀內(nèi)容 40
【任務(wù)2.4】插入圖片并制作非遺機(jī)構(gòu)介紹頁面 42
智海引航 46
【問題】相對路徑和絕對路徑的區(qū)別 46
匠心獨(dú)運(yùn)——泥塑乾坤 紫砂傳奇 47
單元習(xí)題 47
單元3 表格應(yīng)用與制作非遺名錄頁面 49
學(xué)習(xí)目標(biāo) 49
情景導(dǎo)入 49
【任務(wù)3.1】設(shè)計(jì)非遺名錄頁面 49
【任務(wù)3.2】創(chuàng)建表格并制作非遺名錄 50
【任務(wù)3.3】表格結(jié)構(gòu)化標(biāo)記與非遺名錄優(yōu)化 61
【任務(wù)3.4】布局表格并制作非遺名錄頁面 64
智海引航 69
【問題3.1】網(wǎng)頁不使用表格進(jìn)行復(fù)雜頁面布局的原因 69
【問題3.2】常用的與表格相關(guān)的CSS屬性 69
匠心獨(dú)運(yùn)——吳腔軟語 歌韻千年 69
單元習(xí)題 70
單元4 HTML5表單與非遺網(wǎng)站登錄頁面和非遺網(wǎng)站注冊頁面的制作 71
學(xué)習(xí)目標(biāo) 71
情景引入 71
【任務(wù)4.1】設(shè)計(jì)非遺網(wǎng)站登錄頁面和注冊頁面 72
【任務(wù)4.2】創(chuàng)建表單并制作非遺網(wǎng)站登錄頁面 73
【任務(wù)4.3】添加表單控件并制作非遺網(wǎng)站注冊頁面 79
【任務(wù)4.4】設(shè)置HTML5表單控件屬性并驗(yàn)證表單數(shù)據(jù) 89
【任務(wù)4.5】使用正則表達(dá)式進(jìn)行復(fù)雜數(shù)據(jù)驗(yàn)證 95
智海引航 97
【問題4.1】用戶提交表單后表單數(shù)據(jù)的處理過程 97
【問題4.2】用戶繞過了部分驗(yàn)證后,確保數(shù)據(jù)安全的方式 97
匠心獨(dú)運(yùn)——太極生輝 武蘊(yùn)道心 98
單元習(xí)題 98
單元5 CSS基礎(chǔ)與制作非遺活動(dòng)詳情頁面 100
學(xué)習(xí)目標(biāo) 100
情景導(dǎo)入 100
【任務(wù)5.1】設(shè)計(jì)非遺活動(dòng)詳情頁面 101
【任務(wù)5.2】設(shè)計(jì)字體樣式并美化非遺活動(dòng)詳情頁面頭部區(qū)域 102
【任務(wù)5.3】精細(xì)排版文本并美化非遺活動(dòng)詳情頁面正文區(qū)域 117
【任務(wù)5.4】制作并美化非遺活動(dòng)詳情頁面 122
智海引航 131
【問題5.1】舉例說明CSS代碼調(diào)試方法 131
【問題5.2】舉例說明CSS的繼承性和層疊性 132
匠心獨(dú)運(yùn)——竹龍翻騰 薪火相傳 135
單元習(xí)題 135
單元6 CSS高級應(yīng)用與制作非遺項(xiàng)目申報(bào)指南頁面 137
學(xué)習(xí)目標(biāo) 137
情景導(dǎo)入 137
【任務(wù)6.1】設(shè)計(jì)非遺項(xiàng)目申報(bào)指南頁面 138
【任務(wù)6.2】創(chuàng)建列表并制作非遺項(xiàng)目申報(bào)指南區(qū)域 139
【任務(wù)6.3】設(shè)置邊框樣式并制作文件下載區(qū)域 150
【任務(wù)6.4】制作并美化水平導(dǎo)航欄 156
【任務(wù)6.5】設(shè)置背景樣式并美化非遺項(xiàng)目申報(bào)指南頁面 161
智海引航 174
【問題6.1】列表在網(wǎng)頁上的默認(rèn)樣式 174
【問題6.2】CSS3中新增的與背景設(shè)置相關(guān)的屬性 175
匠心獨(dú)運(yùn)——吳音婉轉(zhuǎn) 彈詞留香 175
單元習(xí)題 176
單元7 網(wǎng)頁布局與制作精彩非遺資訊頁面 178
學(xué)習(xí)目標(biāo) 178
情景導(dǎo)入 178
【任務(wù)7.1】設(shè)計(jì)精彩非遺資訊頁面 179
【任務(wù)7.2】認(rèn)識盒子模型并搭建精彩非遺資訊頁面整體布局 180
【任務(wù)7.3】了解元素浮動(dòng)并制作資訊推介區(qū)域 191
【任務(wù)7.4】學(xué)習(xí)元素定位并制作專題報(bào)道區(qū)域 202
【任務(wù)7.5】整合并美化精彩非遺資訊頁面 212
智海引航 214
【問題7.1】實(shí)現(xiàn)多個(gè)塊級元素在同一行顯示的CSS屬性 214
【問題7.2】舉例說明常見的網(wǎng)頁布局設(shè)計(jì)和網(wǎng)頁布局技術(shù) 215
匠心獨(dú)運(yùn)——昆韻流長 古調(diào)新聲 217
單元習(xí)題 217
單元8 JavaScript基礎(chǔ)與非遺網(wǎng)站首頁的制作 220
學(xué)習(xí)目標(biāo) 220
情景導(dǎo)入 220
【任務(wù)8.1】設(shè)計(jì)非遺網(wǎng)站首頁 221
【任務(wù)8.2】熟悉JavaScript基礎(chǔ)語法并制作非遺網(wǎng)站首頁輪播圖 222
【任務(wù)8.3】了解常用函數(shù)并實(shí)現(xiàn)定時(shí)切換圖片 237
【任務(wù)8.4】認(rèn)識JavaScript事件并實(shí)現(xiàn)手動(dòng)切換圖片 239
【任務(wù)8.5】制作輪播圖/ 244
【任務(wù)8.6】制作非遺網(wǎng)站首頁 247
智海引航 256
【問題8.1】JavaScript中與異常捕獲有關(guān)的機(jī)制 256
【問題8.2】避免JavaScript 作為弱類型編程語言帶來問題的方法 256
匠心獨(dú)運(yùn)——古韻新彩 桃花依舊 257
單元習(xí)題 257