本书分为上、下两篇，上篇为实训（课内同步实验），包括HTML基础（Web前端开发环境配置与HTML基础，格式化文本、段落与列表，超链接与多媒体文件应用）、页面布局技术（DIV+CSS综合应用、DIV+CSS布局规划、表格与表格页面布局、表单页面设计）、HTML5基础与CSS3应用、JavaScript应用（JavaScript基础应用、JavaScript高级应用、JavaScript事件分析、DOM与BOM应用案例、HTML5高级应用案例），内含13次实训、41个实训项目、26个课外拓展训练项目；下篇为实践（课程设计），包括高校网站设计、企业网站设计和社会团体网站设计3个典型案例。
本书结构合理，实训项目设计由浅入深、循序渐进、经典实用，实验过程详细，实训项目切合实际，真实性强。
本书可作为高等学校数据科学与大数据技术、计算机科学与技术、软件工程、信息管理与信息系统、网络工程、物联网工程、信息科学技术、数字媒体技术及其他相关专业或计算机公共基础的“网页设计与开发”“网页制作”“Web客户端编程”“Web前端开发技术”“Web应用开发”等课程实验与实训教材，也可作为从事Web开发相关工作的工程技术人员的参考书。

上篇 实训（课内同步实验）
第一部分 HTML基础
实训1 Web前端开发环境配置与HTML基础
项目1 Web前端开发环境配置
项目2 使用HX创建项目和文件
项目3 公民基本道德规范宣传页设计
项目4 IT新书推荐
项目5 我爱我的岗位：Web前端开发
课外拓展训练1
实训2 格式化文本、段落与列表
项目6 中国古代道德教育故事——孔融让梨
项目7 中国传统道德故事集锦
项目8 设计制度宣传展板
项目9 社会主义核心价值观内容
课外拓展训练2
实训3 超链接与多媒体文件应用
项目10 旅游景点欣赏
项目11 Web前端技术新书推荐
项目12 万维网简介
项目13 “专业课程简介”页面
课外拓展训练3
第二部分 页面布局技术
实训4 DIV+CSS综合应用
项目14 设计“《中国教育网络》杂志简介”页面
项目15 设计“京东商品导购”页面
课外拓展训练4
实训5 DIV+CSS布局规划
项目16 DIV+CSS页面布局设计
项目17 设计“Web前端开发技术课程网站”页面
课外拓展训练5
实训6 表格与表格页面布局
项目18 设计“TF43：前端的发展与未来-日程表”页面
项目19 简易电子政务网
课外拓展训练6
实训7 表单页面设计
项目20 设计“留言板”页面
项目21 设计“大学生暑期社会实践调查问卷”页面
课外拓展训练7
第三部分 HTML5基础与CSS3应用
实训8 HTML5与CSS3应用实战
项目22 当当网企业用户注册页面设计
项目23 HTML5结构元素页面布局设计
项目24 HAB公司行业案例CSS3特效页面设计
项目25 纯CSS3偏光图像画廊
课外拓展训练8
第四部分 JavaScript应用
实训9 JavaScript基础应用
项目26 改变新闻网页中的字号
项目27 计算任意区间内连续自然数的累加和
项目28 国债认购小程序
课外拓展训练9
实训10 JavaScript高级应用
项目29 劳务报酬个人所得税计算器
项目30 区间内整数的阶乘累加器
项目31 统计英文字母出现的频次
课外拓展训练10
实训11 JavaScript事件分析
项目32 设计校园办公系统认证页面
项目33 鼠标动作捕获与响应
课外拓展训练11
实训12 DOM与BOM应用案例
项目34 体彩大乐透投注程序
项目35 简易图书选购程序
项目36 简易轮播图设计
项目37 列表框图像浏览器
课外拓展训练12
实训13 HTML5高级应用案例
项目38 基于Web Storage的当当网图书评论页面
项目39 用HTML5 Canvas开发一个小游戏
项目40 用HTML5拖曳开发购物车
项目41 使用Web Worker做后台数值（算法）计算
课外拓展训练13
下篇 实践（课程设计）
第五部分 网站设计
“Web前端开发技术”课程设计
任务A 高校网站设计——Web技术大学网站
任务B 企业网站设计——江苏济世信息技术有限公司网站
任务C 社会团体网站设计——太空市互联网协会网站
参考文献