本书秉承“思政引领，立德树人”的教育理念，自然融入多维度、深层次的思政元素，全面对标企业和行业需求；引入现代Web前端开发的核心技术，如Flex布局、Grid布局，以及人工智能编程插件，同时融入企业开发实践，确保学习内容与实际工作紧密相关。全书以一个完整案例为主线，结合综合项目实战操作，体现育人、应用和创新三项能力。本书配套提供课程思政元素、案例源代码、PPT课件、课后习题与答案、微课视频、教案、教学大纲、章节测试、云题库、实验报告、学习通在线课程、企业高频面试题、学科竞赛真题等丰富的教学资源，并设有QQ群提供线上学习跟踪和指导服务。
本书共分14章，系统地讲解Web前端开发的核心技术，主要内容包括Web前端开发概述、HTML5基础、HTML5页面元素和属性、表单、CSS3基础、CSS3修饰页面元素、CSS3高级选择器、CSS3盒子模型、浮动与定位、CSS3高级应用、网页布局、Flex布局、Grid布局等，并提供“大学生参军入伍专题网站”和“文创商城”两个实战案例。
本书既可作为本专科院校计算机相关专业的Web程序设计、网页设计与制作等课程的教材，也可作为Web应用开发人员的自学手册和技术参考书。

第1章 Web前端开发概述 1
1.1 Web前端开发职责 1
1.2 Web前端开发相关概念 2
1.3 Web前端开发相关技术 3
1.3.1 Web标准 3
1.3.2 HTML 4
1.3.3 CSS 4
1.3.4 JavaScript 5
1.4 Web前端开发工具 5
1.4.1 代码编辑工具：VSCode 6
1.4.2 代码运行工具：浏览器 8
1.4.3 开发者工具 9
1.4.4 人工智能辅助编程工具 10
1.5 网站设计与开发流程 11
1.6 实战案例：网页显示“社会主义核心价值观” 12
1.7 本章小结 13
第2章 HTML5基础 14
2.1 HTML5语法基础 14
2.1.1 HTML文档结构 14
2.1.2 HTML标签语法 17
2.1.3 HTML注释 18
2.2 文本控制标签 19
2.2.1 标题标签 19
2.2.2 段落标签 20
2.2.3 换行标签 20
2.2.4 文本格式化标签 21
2.2.5 特殊字符 22
2.3 图像标签 23
2.3.1 网页常用图像格式 23
2.3.2 图像标签的使用 24
2.3.3 相对路径与绝对路径 26
2.4 超链接标签 27
2.4.1 文本链接 27
2.4.2 图像链接 28
2.4.3 书签（锚点）链接 28
2.4.4 其他链接 30
2.5 列表 30
2.5.1 有序列表 31
2.5.2 无序列表 32
2.5.3 定义列表 34
2.5.4 嵌套列表 35
2.6 表格 36
2.6.1 表格结构 36
2.6.2 表格标签 37
2.7 视频和音频标签 41
2.7.1 视频标签 41
2.7.2 音频标签 42
2.8 其他标签 42
2.8.1 预格式化标签 42
2.8.2 水平线标签 43
2.8.3 行内容器标签 43
2.9 实战案例：“大学生参军网站”兵役登记页面 44
2.10 本章小结 46
第3章 HTML5页面元素和属性 47
3.1 文档结构标签 47
……