相關主題
商品描述
本書對接 對 應用型、覆合型人才的培養要求,依據課程標準和職業技能等級標準,遵循Web前端開發的工作流程編寫而成。本書以紅色文化資源網項目為實踐載體,將Web前端開發的核心知識點有機融入頁面制作全過程,並創新引入AIGC智能編程工具,生動展現AIGC在代碼生成與輔助開發中的強大效能。讀者通過完成紅色文化資源網的建設,不僅能系統掌握Web前端開發的 技能, 能深度體驗人機協同智能編程的現代化開發範式。本書采用HTML5+CSS3技術進行網站制作,共5個項目,主要內容包括走進Web前端開發、搭建頁面主體結構、添加頁面樣式、設計頁面動畫、規劃頁面布局。除了項目5以外,其餘的每個項目都包含若幹個任務,以通關任務、晉級任務的形式讓讀者由淺入深地掌握初級Web前端開發工程師 的知識和技能。本書可以作為職業院校計算機類相關專業Web前端開發課程的教材,也可作為Web前端開發愛好者的學習參考書
目錄大綱
前言
二維碼索引
項目1 走進Web前端開發——Web前端開發概述 001
任務 紅色文化資源網歡迎頁制作 002
通關任務 使用前端開發工具開發第一個網頁 002
晉級任務 紅色文化資源網歡迎頁制作 008
任務小結 009
知識檢驗 010
技能檢驗 010
收獲與反思 011
AIGC擴展應用 安裝與使用CodeGeeX智能編程助手 011
項目2 搭建頁面主體結構——HTML基礎 014
任務 紅色文化資源網結構搭建 015
通關任務1 引導頁結構搭建——HTML概念及基本結構 015
通關任務2 紅色資訊頁面結構搭建——文本標簽 021
通關任務3 紅色景點頁面結構搭建——圖像及超鏈接標簽 026
通關任務4 紅色勝跡頁面結構搭建——列表標簽 033
晉級任務 紅色文化資源網首頁結構搭建 038
任務小結 039
知識檢驗 040
技能檢驗 041
收獲與反思 041
AIGC擴展應用 HTML代碼智能生成 042
項目3 添加頁面樣式——CSS樣式基礎 045
任務1 紅色資訊詳情頁制作——使用CSS設置文字樣式 047
通關任務1 制作紅色資訊詳情頁1——認識CSS樣式 047
通關任務2 制作紅色資訊詳情頁2——CSS文本屬性 063
通關任務3 制作紅色資訊詳情頁3——CSS高級文本屬性 071
晉級任務 制作韋拔群詩詞詳情頁 079
任務小結 081
知識檢驗 082
技能檢驗 084
收獲與反思 084
任務2 紅色景點頁面制作——盒子模型及使用CSS設置圖像樣式 085
通關任務1 制作“龍州起義紀念館”頁面 085
通關任務2 制作“八路軍桂林辦事處紀念館”頁面 088
通關任務3 制作“李明瑞、韋拔群革命烈士紀念館”頁面 097
晉級任務 制作紅色景點展示頁面 105
任務小結 106
知識檢驗 107
技能檢驗 108
收獲與反思 108
任務3 紅色勝跡頁面制作——使用CSS設置列表樣式 109
通關任務1 制作網站導航條 109
通關任務2 制作訪問熱點欄目 112
通關任務3 制作紅色勝跡欄目 115
通關任務4 制作勝跡圖展欄目 118
晉級任務 制作紅色勝跡頁面 126
任務小結 130
知識檢驗 130
技能檢驗 132
收獲與反思 132
任務4 紅色故事頁面制作——使用CSS設置表格樣式 133
通關任務1 制作紅色人物頁面 133
通關任務2 制作紅色故事頁面 136
晉級任務 廣西紅色故事——書籍篇搭建 143
任務小結 145
知識檢驗 146
技能檢驗 147
收獲與反思 148
任務5 登錄頁面和用戶註冊頁面制作——使用CSS設置表單樣式 149
通關任務1 制作登錄頁面 149
通關任務2 制作用戶註冊頁面 154
晉級任務 聯系我們頁面制作 165
任務小結 169
知識檢驗 170
技能檢驗 173
收獲與反思 173
AIGC擴展應用 CSS樣式智能生成 174
項目4 設計頁面動畫——CSS3動畫 180
任務1 CSS3過渡動畫制作 181
通關任務1 制作網站導航條動畫 181
通關任務2 為勝跡圖展欄目設置遮罩效果 184
任務2 CSS3變形動畫制作 189
通關任務1 制作變形導航條 189
通關任務2 制作照片墻 194
任務3 CSS3自定義動畫制作 197
通關任務1 制作加載動畫 197
通關任務2 制作運動的小球 201
晉級任務 為紅色勝跡頁面添加動畫效果 203
任務小結 204
知識檢驗 204
技能檢驗 205
收獲與反思 206
AIGC擴展應用 CSS動畫智能生成 206
項目5 規劃頁面布局(綜合案例)——首頁 209
任務 首頁制作 210
知識檢驗 221
技能檢驗 222
收獲與反思 222
參考文獻 223
