Web前端开发基础 / “十四五”高等职业教育计算机类专业新形态一体化系列教材
定价：￥49.80
作者： 凌财进，曾婷，吴洲
出版时间：2025-07
最新印次日期：2025-7
出版社：中国铁道出版社
试读
- 中国铁道出版社
- 9787113319854
- 1版
- 572140
- 16开
- 2025-07
- 电子与信息大类
- 计算机类
- 计算机类
- 高职
作者简介
内容简介
本书为“十四五”高等职业教育计算机类专业新形态一体化系列教材之一，从Web前端工程师的实际岗位应用的角度阐述了HTML5和CSS3的基础知识、新元素和响应式布局的新技能，设置了“广东红色文化”主题网站制作、电子商务网站、广东优秀传统文化项目综合实训等10个项目，将HTML5和CSS3的相关知识合理地安排到各个项目中。
全书采用项目贯穿、任务驱动、理论实践一体化的教学方法，每个项目设置项目导读→学习目标→知识准备→项目评价等教学环节，同时提供了丰富的配套教学资源，配有微课视频，读者扫描书中二维码即可观看学习。
本书层次清晰、内容丰富、技术实用，代码遵循Web标准，适合作为高等职业院校计算机应用技术、计算机网络技术、电子信息技术等相关专业的Web前端开发、网页设计与制作等课程的教材，也可作为广大Web前端开发者或社会人士学习Web前端开发技术的参考用书。
全书采用项目贯穿、任务驱动、理论实践一体化的教学方法，每个项目设置项目导读→学习目标→知识准备→项目评价等教学环节，同时提供了丰富的配套教学资源，配有微课视频，读者扫描书中二维码即可观看学习。
本书层次清晰、内容丰富、技术实用，代码遵循Web标准，适合作为高等职业院校计算机应用技术、计算机网络技术、电子信息技术等相关专业的Web前端开发、网页设计与制作等课程的教材，也可作为广大Web前端开发者或社会人士学习Web前端开发技术的参考用书。
目录
项目一 Web前端开发准备工作.1
项目导读1
学习目标1
知识准备2
一、基础概念2
二、Web标准的概念4
三、CSS与CSS3：从基础到高级样式设计5
四、开发工具7
五、使用的浏览器.7
六、HTML标记和元素8
任务一 创建网站项目及站点管理12
任务二 创建第1个HTML页面.13
知识拓展.14
项目评价.15
项目二 “广东红色文化”主题网站制作——HTML5基础16
项目导读.16
学习目标.16
知识准备.17
一、文本元素17
二、列表元素21
三、图片元素25
四、超链接27
任务一 使用文本段落标记元素完成招聘页面的制作.31
任务二 使用列表元素制作网页中的新闻页面34
任务三 使用图片和超链接制作新闻页面.36
项目评价38
项目三 “广东红色文化”主题网站制作——CSS语言基础39
项目导读39
学习目标39
知识准备40
一、CSS基本语法40
二、CSS文字样式44
三、CSS文本属性47
四、CSS的优先级50
五、CSS层叠性与继承性51
六、CSS基础选择器.53
七、CSS设置列表样式.57
任务一 使用文本段落标记元素及CSS样式完成招聘页面的制作.59
任务二 使用CSS基础选择器美化家乡旅游特色的页面.60
任务三 使用CSS样式美化新闻列表页面63
项目评价65
项目四 “广东红色文化”主题网站制作——CSS3高级选择器66
项目导读66
学习目标66
知识准备67
一、属性选择器67
二、伪类选择器及伪类元素73
三、关系选择器82
任务一 使用CSS的伪类选择器制作“广东省各市红色文化”
新闻景点页面88
任务二综合运用伪类选择器与伪元素制作“广东红色文化特色
展览”页面89
项目评价92
项目五 “广东红色文化”主题网站制作——CSS盒子模型93
项目导读93
学习目标93
知识准备94
一、盒子模型与概念.94
二、盒子模型相关属性.98
三、设置背景颜色和背景图像的CSS属性107
四、CSS3渐变属性.110
任务一 使用CSS盒子模型布局“广州红色旅游文化”明信片114
任务二 使用CSS美化“广州红色旅游文化”明信片页面117
项目评价120
项目六 “广东红色文化”主题网站制作——DIV+CSS网页布局.121
项目导读121
学习目标.121
知识准备122
一、经典布局与CSS布局122
二、DIV+CSS布局的应用124
三、响应式布局126
四、元素的浮动127
五、元素的定位130
六、元素的类型与转换137
任务一 使用DIV+CSS进行页面浮动布局140
任务二 使用CSS进行页面美化143
任务三 使用定位元素制作二级导航146
项目评价147
项目七 “广东红色文化”主题网站制作——表格与表单.148
项目导读148
学习目标148
知识准备149
一、表格应用.149
二、表单定义.155
三、HTML5新增表单元素和属性160
任务一 使用表格元素制作一个招聘页面的信息表162
任务二 使用表单元素制作一个注册信息页面165
项目评价168
项目八 “广东红色文化”主题网站制作——CSS3动画效果169
项目导读169
学习目标169
知识准备170
一、过渡效果.170
二、变形动画（transform）171
三、动画（animation）174
任务一 使用过渡动画制作一个文字下拉效果175
任务二 使用3D变形动画制作图片翻转效果177
项目评价178
项目九 电子商务网站的制作——Flexbox和Grid布局.179
项目导读179
学习目标179
知识准备180
一、弹性盒布局180
二、网格布局.186
任务一 使用弹性盒子制作电子商务书城网站的布局191
任务二 使用网格制作电子商务主题书城网站的布局194
任务三 美化电子商务书城网站197
任务四 电子商务书城轮播图的制作200
项目评价204
项目十 广东优秀传统文化项目综合实训.205
项目导读205
学习目标205
知识准备206
一、HTML5网站需求分析.206
二、网站建设流程与技术实现.207
任务一 HTML5网页布局构建.207
任务二 二级和三级页面制作217
项目评价222
参考文献
项目导读1
学习目标1
知识准备2
一、基础概念2
二、Web标准的概念4
三、CSS与CSS3：从基础到高级样式设计5
四、开发工具7
五、使用的浏览器.7
六、HTML标记和元素8
任务一 创建网站项目及站点管理12
任务二 创建第1个HTML页面.13
知识拓展.14
项目评价.15
项目二 “广东红色文化”主题网站制作——HTML5基础16
项目导读.16
学习目标.16
知识准备.17
一、文本元素17
二、列表元素21
三、图片元素25
四、超链接27
任务一 使用文本段落标记元素完成招聘页面的制作.31
任务二 使用列表元素制作网页中的新闻页面34
任务三 使用图片和超链接制作新闻页面.36
项目评价38
项目三 “广东红色文化”主题网站制作——CSS语言基础39
项目导读39
学习目标39
知识准备40
一、CSS基本语法40
二、CSS文字样式44
三、CSS文本属性47
四、CSS的优先级50
五、CSS层叠性与继承性51
六、CSS基础选择器.53
七、CSS设置列表样式.57
任务一 使用文本段落标记元素及CSS样式完成招聘页面的制作.59
任务二 使用CSS基础选择器美化家乡旅游特色的页面.60
任务三 使用CSS样式美化新闻列表页面63
项目评价65
项目四 “广东红色文化”主题网站制作——CSS3高级选择器66
项目导读66
学习目标66
知识准备67
一、属性选择器67
二、伪类选择器及伪类元素73
三、关系选择器82
任务一 使用CSS的伪类选择器制作“广东省各市红色文化”
新闻景点页面88
任务二综合运用伪类选择器与伪元素制作“广东红色文化特色
展览”页面89
项目评价92
项目五 “广东红色文化”主题网站制作——CSS盒子模型93
项目导读93
学习目标93
知识准备94
一、盒子模型与概念.94
二、盒子模型相关属性.98
三、设置背景颜色和背景图像的CSS属性107
四、CSS3渐变属性.110
任务一 使用CSS盒子模型布局“广州红色旅游文化”明信片114
任务二 使用CSS美化“广州红色旅游文化”明信片页面117
项目评价120
项目六 “广东红色文化”主题网站制作——DIV+CSS网页布局.121
项目导读121
学习目标.121
知识准备122
一、经典布局与CSS布局122
二、DIV+CSS布局的应用124
三、响应式布局126
四、元素的浮动127
五、元素的定位130
六、元素的类型与转换137
任务一 使用DIV+CSS进行页面浮动布局140
任务二 使用CSS进行页面美化143
任务三 使用定位元素制作二级导航146
项目评价147
项目七 “广东红色文化”主题网站制作——表格与表单.148
项目导读148
学习目标148
知识准备149
一、表格应用.149
二、表单定义.155
三、HTML5新增表单元素和属性160
任务一 使用表格元素制作一个招聘页面的信息表162
任务二 使用表单元素制作一个注册信息页面165
项目评价168
项目八 “广东红色文化”主题网站制作——CSS3动画效果169
项目导读169
学习目标169
知识准备170
一、过渡效果.170
二、变形动画（transform）171
三、动画（animation）174
任务一 使用过渡动画制作一个文字下拉效果175
任务二 使用3D变形动画制作图片翻转效果177
项目评价178
项目九 电子商务网站的制作——Flexbox和Grid布局.179
项目导读179
学习目标179
知识准备180
一、弹性盒布局180
二、网格布局.186
任务一 使用弹性盒子制作电子商务书城网站的布局191
任务二 使用网格制作电子商务主题书城网站的布局194
任务三 美化电子商务书城网站197
任务四 电子商务书城轮播图的制作200
项目评价204
项目十 广东优秀传统文化项目综合实训.205
项目导读205
学习目标205
知识准备206
一、HTML5网站需求分析.206
二、网站建设流程与技术实现.207
任务一 HTML5网页布局构建.207
任务二 二级和三级页面制作217
项目评价222
参考文献
