本书对接国家对高级应用型、复合型人才的培养要求，依据课程标准和职业技能等级标准，遵循Web前端开发的工作流程编写而成。本书以红色文化资源网项目为实践载体，将Web前端开发的核心知识点有机融入页面制作全过程，并创新引入AIGC智能编程工具，生动展现AIGC在代码生成与辅助开发中的强大效能。读者通过完成红色文化资源网的建设，不仅能系统掌握Web前端开发的必备技能，更能深度体验人机协同智能编程的现代化开发范式。 本书采用HTML5+CSS3技术进行网站制作，共5个项目，主要内容包括走进Web前端开发、搭建页面主体结构、添加页面样式、设计页面动画、规划页面布局。除了项目5以外，其余的每个项目都包含若干个任务，以通关任务、晋级任务的形式让读者由浅入深地掌握初级Web前端开发工程师必备的知识和技能。 本书可以作为职业院校计算机类相关专业Web前端开发课程的教材，也可作为Web前端开发爱好者的学习参考书。 本书配有电子课件等资源，选用本书作为授课教材的教师可登录机械工业出版社教育服务网（www.cmpedu.com）注册后免费下载或联系编辑（010-88379807）咨询。

职业院校教师

目 录
前言
二维码索引
项目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