本教材具有以下特色：

　　（1）校企合作，内容与时俱进：编写团队由行业企业专家、一线技术骨干和职业院校骨干教师组成。编写团队通过深入企业调研、召开研讨会等方式，准确把握行业发展趋势和企业用人需求，将企业的新技术、新工艺、新规范融入教材内容，确保教材的实用性和前瞻性。

　　（2）任务驱动，激发学习热情：本教材共分为十一个模块。每个模块均采用六段式体例编写，使读者能够从整体上把握每个模块的学习目标与学习任务，怀揣着完成任务案例的迫切心情进行知识与技能的学习，激发学习兴趣。此外，教材还设置了“想一想”“多学一招”等思考实践环节，引导学生在阅读时深入思考问题、拓展思维，提升认知水平。 

　　（3）思政融入，培育职业素养：教材中所有案例的文字、图片素材均围绕思政元素精心设计，将思想政治教育元素有机融入教材内容，培养学生的职业道德、工匠精神和爱国情怀。通过案例分析、讨论等方式，引导学生树立正确的价值观和职业观，增强社会责任感和使命感。

　　（4）数字赋能，助力高效学习：本书将“互联网+”思想融入教材，配套了丰富的数字化资源，如教学视频、电子课件、习题参考答案等。学习者可以通过扫描二维码方式获取这些资源，帮助读者更好地理解和掌握相关知识和技能，提高学习效果。

模块1 Web前端开发基础 ……………………………………………… 1

　单元1.1 认识网页和网站 ………………………………………………………………… 1

　单元1.2 浏览器与 Web服务器 ………………………………………………………… 5

　单元1.3 Web前端开发技术及标准……………………………………………………… 6

　单元1.4 网页制作工具 …………………………………………………………………… 8

模块2 使用 HTML5组织页面内容 …………………………………… 15

　单元2.1 HTML基础 …………………………………………………………………… 16

　单元2.2 文本控制标签 ………………………………………………………………… 20

　单元2.3 图像标签 ……………………………………………………………………… 26

　单元2.4 超链接标签 …………………………………………………………………… 28

　单元2.5 列表标签 ……………………………………………………………………… 32

　单元2.6 表格标签 ……………………………………………………………………… 36

　单元2.7 <div>标签 …………………………………………………………………… 38

　单元2.8 应用案例 ……………………………………………………………………… 39

模块3 使用 HTML5新增的标签 ……………………………………… 46

　单元3.1 HTML5新增的语义标签 …………………………………………………… 47

　单元3.2 HTML5视频、音频标签 ……………………………………………………… 58

　单元3.3 应用案例 ……………………………………………………………………… 61

模块4 HTML表单的使用 ……………………………………………… 68

　单元4.1 HTML表单标签 ……………………………………………………………… 69

　单元4.2 HTML基础表单元素 ………………………………………………………… 70

　单元4.3 HTML5新增表单元素 ……………………………………………………… 81

　单元4.4 应用案例 ……………………………………………………………………… 87

模块5 使用 CSS设置网页样式 ……………………………………… 93

　单元5.1 认识 CSS ……………………………………………………………………… 94

　单元5.2 CSS选择器 …………………………………………………………………… 99

　单元5.3 CSS文本与字体样式属性 …………………………………………………… 107

　单元5.4 CSS背景样式 ………………………………………………………………… 115

　单元5.5 CSS的层叠性、继承性和优先级 …………………………………………… 120

　单元5.6 应用案例 ……………………………………………………………………… 122

模块6 网页布局与定位 ……………………………………………… 130

　单元6.1 网页布局与盒子模型 ………………………………………………………… 131

　单元6.2 元素类型与转换 ……………………………………………………………… 136

　单元6.3 元素的定位方式 ……………………………………………………………… 137

　单元6.4 CSS布局 ……………………………………………………………………… 146

　单元6.5 弹性盒子 ……………………………………………………………………… 151

　单元6.6 应用案例 ……………………………………………………………………… 159

模块7 制作网页导航条和新闻列表 ………………………………… 167

　单元7.1 CSS列表样式 ………………………………………………………………… 168

　单元7.2 CSS边框样式 ………………………………………………………………… 174

　单元7.3 CSS边距样式 ………………………………………………………………… 179

　单元7.4 应用案例 ……………………………………………………………………… 181

模块8 使用 CSS3美化页面 ………………………………………… 196

　单元8.1 CSS3边框属性 ……………………………………………………………… 197

　单元8.2 文本阴影与文本溢出 ………………………………………………………… 205

　单元8.3 图标字体 ……………………………………………………………………… 208

　单元8.4 CSS3的2D转换、过渡与动画 ……………………………………………… 211

　单元8.5 应用案例 ……………………………………………………………………… 218

模块9 JavaScript基本使用 ………………………………………… 225

　单元9.1 JavaScript基础 ……………………………………………………………… 226

　单元9.2 JavaScript语言基础 ………………………………………………………… 229

　单元9.3 JavaScript程序结构 ………………………………………………………… 234

　单元9.4 JavaScript函数 ……………………………………………………………… 238

　单元9.5 JavaScript对象 ……………………………………………………………… 240

　单元9.6 事件处理 ……………………………………………………………………… 250

　单元9.7 应用案例 ……………………………………………………………………… 252

模块10 使用jQuery实现动态效果 …………………………………… 260

　单元10.1 jQuery基础 ………………………………………………………………… 261

　单元10.2 jQuery的使用 ……………………………………………………………… 262

　单元10.3 jQuery选择器 ……………………………………………………………… 265

　单元10.4 jQuery的事件绑定与处理 ………………………………………………… 270

　单元10.5 jQuery的 DOM 操作 ……………………………………………………… 272

　单元10.6 jQuery动画特效 …………………………………………………………… 277

　单元10.7 应用案例 …………………………………………………………………… 285

模块11 综合案例 ……………………………………………………… 291

　单元11.1 制作页面内容 ……………………………………………………………… 293

　单元11.2 完善页面内容 ……………………………………………………………… 314

参考文献 ………………………………………………………………… 319