Web标准的一大特点是采用“HTML+CSS+JavaScript”将网页内容、外观样式以及动态效果彻底分离，以便于分工设计和代码重用。本书站在初学者的角度，以实用的案例、通俗易懂的语言详细介绍了使用HTML、CSS及JavaScript进行网页制作的技巧。
全书分为8个项目，结合HTML、CSS和JavaScript的基础知识及应用，提供了7种不同类型的网页设计案例。其中，项目1介绍了HTML、CSS以及JavaScript的基础知识，包括Web基本概念、HTML、CSS、JavaScript简介、Dreamweaver工具的使用等；项目2~项目8为7个完整的网页设计项目，涉及“博客”“网店”“家居”“教育”“婚恋”“视频”“美食”多个方向，有助于学生掌握不同网站的设计风格和制作技巧。全书以项目为导向，通过项目将章节知识点串起来，学完一章内容就能制作一个完整的项目页面，能大大激发学生的学习兴趣。
本书附有源代码、习题、教学课件等资源，而且为了帮助初学者更好地学习本书讲解的内容，还提供了在线答疑，希望得到更多读者的关注。
本书既可作为高等院校本、专科相关专业的网页设计与制作课程的教材，也可作为网页平面设计的培训教材，是一本适合网页制作、美工设计、网站开发、网页编程等行业人员阅读与参考的优秀读物。
本书既可作为高等院校本、专科计算机相关专业的专用教材，也可以作为技术爱好者的入门用书。
HTML、CSS和JavaScript是网页制作技术的核心和基础，也是每个网页制作者都应掌握的基本知识，它们在网页设计中不可或缺。本书是在第一版《网页设计与制作项目教程（HTML+CSS+JavaScript）》的基础上修订而成，在优化原图书内容的同时，又新增了以下内容。
1.
在书中增加了HTML5部分基础标签和CSS3新属性的讲解和应用。
2.
在书中增加了网页视听技术的应用，主要包括音频、视频的嵌入和动画效果。
3.
调整了JavaScript部分知识点的顺序，更符合由浅入深、循序渐进的学习思路。
4.
在书中更换了部分案例，增强本书的实用性。
项目1 网页制作基础知识 【任务1-1】认识网页 需求分析 知识储备 1. 网页的构成 2. 网页的相关名词 3. Web标准 【任务1-2】网页制作入门技术 需求分析 知识储备 1. HTML简介 2. CSS简介 3. JavaScript简介 4. 常见浏览器介绍 【任务1-3】Dreamweaver工具的使用 需求分析 知识储备 1. Dreamweaver界面介绍 2. Dreamweaver初始化设置 3. Dreamweaver文档的基本操作 4. 创建第一个网页 【项目总结】 【课后练习】 项目2 “博客”页面制作 【项目描述】 【任务2-1】认识HTML 需求分析 知识储备 1. HTML文档基本格式 2. HTML标签 3. HTML标签的属性 4. HTML标签的关系 5. HTML文档头部相关标签 【任务2-2】HTML文本控制标签 需求分析 知识储备 1. 页面格式化标签 2. 文本样式标签 3. 文本格式化标签 4. 特殊字符标签 知识拓展 <div>标签 【任务2-3】HTML图像应用 需求分析 知识储备 1. 常用图像格式 2. 图像标签 3. 相对路径和绝对路径 知识拓展 切图 【任务2-4】页面建设准备工作 网站素材整理 1. 网站站点建立 2. “博客”页面切图 页面结构分析 页面布局 【任务2-5】制作“头部”模块 效果分析 模块制作 【任务2-6】制作“博主简介”模块 效果分析 模块制作 【任务2-7】制作“旅游随笔”模块 效果分析 模块制作 【任务2-8】制作“驴友评论”模块 效果分析 模块制作 【任务2-9】制作“页脚”模块 效果分析 模块制作 【项目总结】 【课后练习】 项目3 “网上花店”专题页制作 【项目描述】 【任务3-1】CSS核心基础 需求分析 知识储备 1. 结构与表现分离 2. CSS样式规则 3. CSS样式表的引入 4. CSS基础选择器 【任务3-2】CSS文本样式属性 需求分析 知识储备 1. CSS字体样式属性 2. CSS文本外观属性 知识拓展 1. CSS定义背景颜色 【任务3-3】CSS高级特性 需求分析 知识储备 1. CSS复合选择器 （3） 并集选择器 2. CSS层叠性与继承性 3. CSS优先级 【任务3-4】页面建设准备工作 网站素材整理 1. 网站站点建立 2. 切图 页面结构分析 1. HTML结构分析 2. CSS样式分析 定义基础样式 1. 页面布局 2. 公共样式设置 【任务3-5】制作“标题”模块 效果分析 1. 结构分析 2. 样式分析 模块制作 1. 搭建结构 2. 控制样式 【任务3-6】制作“分类”模块 效果分析 1. 结构分析 2. 样式分析 模块制作 1. 搭建结构 2. 添加样式 【任务3-7】制作“热卖”模块 效果分析 1. 结构分析 2. 样式分析 模块制作 1. 搭建结构 2. 控制样式 【任务3-8】制作“页脚”模块 效果分析 1. 结构分析 2. 样式分析 模块制作 1. 搭建结构 2. 控制样式 【项目总结】 【课后练习】 项目4“爱家居”企业网站首页制作 【项目描述】 【任务4-1】认识盒子模型 需求分析 知识储备 1. 认识盒子模型 【任务4-2】盒子模型基础属性 需求分析 知识储备 1. 边框属性 2. 内边距属性 3. 外边距属性 4. 背景属性 5. 宽度属性和高度属性 【任务4-3】盒子模型新增属性 需求分析 知识储备 1. 透明 2. 圆角 3. 阴影 4. 渐变 【任务4-3】元素的类型与转换 需求分析 知识储备 1. 元素的类型 2. <span>标签 3. 元素的转换 知识拓展 1. 块元素垂直外边距的合并 【任务4-4】元素的浮动 需求分析 知识储备 1. 元素的浮动属性 2. 清除浮动 3. overflow属性 【任务4-5】元素的定位 需求分析 知识储备 1. 元素的定位属性 2. 静态定位 3. 相对定位 4. 绝对定位 5. 固定定位 6. z-index属性 【任务4-6】布局及定义基础样式 网站素材的整理 页面结构分析 定义基础样式 1. 页面布局 2. 定义基础样式 【任务4-7】制作导航及banner模块 效果分析 1. 结构分析 2. 样式分析 模块制作 1. 搭建结构 2. 控制样式 【任务4-8】制作“热门推荐”模块 效果分析 模块制作 1. 搭建结构 2. 控制样式 【任务4-9】制作“夏日生活”模块 效果分析 1. 结构分析 2. 样式分析 模块制作 1. 搭建结构 2. 控制样式 【任务4-10】制作“版权信息”模块和“悬浮框”模块 效果分析 1. 结构分析 模块制作 【项目总结】 【课后练习】 项目5 “优课教育”网站首页面制作 【项目描述】 【任务5-1】列表标签 需求分析 知识储备 1. 无序列表 2. 有序列表 3. 定义列表 4. 列表的嵌套应用 【任务5-2】CSS控制列表样式 需求分析 知识储备 1. list-style复合属性 2. 背景图像定义列表项目符号 【任务5-3】超链接标签 需求分析 知识储备 1. 创建超链接 2. 锚点链接 3. 链接伪类控制超链接 【任务5-4】页面建设准备工作 网站素材整理 页面结构分析 定义基础样式 1. 页面布局 2. 定义基础样式 【任务5-5】制作“导航模块” 效果分析 1. 结构分析 2. 样式分析 模块制作 1. 搭建结构 2. 控制样式 【任务5-6】制作“banner模块”和“课程分类模块” 效果分析 1. 结构分析 2. 样式分析 模块制作 1. 搭建结构 2. 控制样式 【任务5-7】制作“精品展示模块” 效果分析 1. 结构分析 2. 样式分析 模块制作 1. 搭建结构 2. 控制样式 【任务5-8】制作“版权信息模块” 效果分析 1. 结构分析 2. 样式分析 模块制作 1. 搭建结构 2. 控制样式 【项目总结】 【课后练习】 项目6 “千年之恋”注册页面制作 【项目描述】 【任务6-1】认识表格相关标签 需求分析 知识储备 1. 表格的创建 2. <table>标签的属性 3. <tr>标签的属性 4. <td>标签的属性 5. <th>标签的属性 【任务6-2】CSS控制表格样式 需求分析 知识储备 1. CSS控制表格边框 2. CSS控制单元格边距 3. CSS控制单元格的宽高 【任务6-3】表单概述 需求分析 知识储备 1. 初识表单 2. 创建表单 【任务6-4】基础表单控件 需求分析 知识储备 1. input控件 2. textarea控件 3. select控件 【任务6-5】新增表单控件类型和属性 需求分析 知识储备 1. 新增input控件类型 2. 新增input控件属性 【任务6-5】CSS控制表单样式 需求分析 知识储备 1. CSS控制表单样式 【任务6-6】页面建设准备工作 网站素材整理 效果分析 定义基础样式 【任务6-7】制作“头部和导航”模块 效果分析 模块制作 【任务6-8】制作“banner和内容”模块 效果分析 模块制作 【任务6-9】制作“页脚”模块 效果分析 模块制作 【项目总结】 【课后练习】 项目7 “视频8”首页制作 【项目描述】 【任务7-1】网页中嵌入视频和音频 需求分析 知识储备 1. 音频、视频嵌入技术概述 2. 嵌入视频 3. 嵌入音频 4. 浏览器对音视频文件的兼容性 5. 控制视频宽高 【任务7-2】网页中添加过渡效果 需求分析 知识储备 1. transition-property属性 2. transition-duration属性 3. transition-timing-function属性 4. transition-delay属性 5. transition属性 【任务7-3】网页中添加变形效果 需求分析 知识储备 1. 2D变形 2. 3D变形 【任务7-5】网页中添加动画效果 需求分析 知识储备 1. @keyframes规则 2. animation-name属性 3. animation-duration属性 4. animation-timing-function属性 5. animation-delay属性 6. animation-iteration-count属性 7. animation-direction属性 8. animation属性 【任务7-6】页面建设准备工作 网站素材整理 效果分析 定义基础样式 【任务7-7】制作“引导栏”模块 效果分析 模块制作 【任务7-8】制作“导航”模块 效果分析 模块制作 【任务7-9】制作“banner”模块 效果分析 模块制作 【任务7-10】制作“内容”模块 效果分析 模块制作 【任务7-11】制作“页脚”模块 效果分析 模块制作 【项目总结】 【课后练习】 项目8 “甜蜜约会”首页制作 【项目描述】 【任务8-1】JavaScript基础知识 需求分析 知识储备 1. JavaScript简介 2. JavaScript引入方式 3. JavaScript基本语法 4. 第一个简单的JavaScript程序 【任务8-2】变量 需求分析 知识储备 1. 变量的声明 2. 变量的赋值 【任务8-3】数据类型和运算符 需求分析 知识储备 1. 数据类型 2. 运算符 【任务8-4】流程控制语句 需求分析 知识储备 1. 条件语句 2. 循环语句 3. 跳转语句 【任务8-5】函数 需求分析 知识储备 1. 函数的定义 2. 函数的调用 3. 函数中变量的作用域 【任务8-6】对象 需求分析 知识储备 1. 认识对象 2. 创建对象和删除对象属性 3. 内置对象 【任务8-7】数组 需求分析 知识储备 1. 初识数组 2. 创建数组 3. 数组的常用属性和方法 4. 二维数组 【任务8-8】BOM对象与DOM对象 需求分析 知识储备 1. BOM对象 2. DOM对象 【任务8-9】事件处理 需求分析 知识储备 1. 事件和事件调用 2. 常用的JavaScript事件 【任务8-10】页面建设准备工作 网站素材整理 效果分析 定义基础样式 1. 页面布局 2. 定义基础样式 【任务8-11】制作“头部及导航”模块 效果分析 1. 结构分析 2. 样式分析 模块制作 1. 搭建结构 2. 控制样式 【任务8-12】制作“banner”模块 效果分析 1. 结构分析 2. 样式分析 3. JavaScript特效分析 模块制作 1. 搭建结构 2. 控制样式 【任务8-13】制作“简介”模块 效果分析 1. 结构分析 2. 样式分析 3. JavaScript特效分析 模块制作 1. 搭建结构 2. 控制样式 3. 添加JS效果 【任务8-14】制作“推荐”模块 效果分析 1. 结构分析 2. 样式分析 3. JavaScript特效分析 模块制作 1. 搭建结构 2. 控制样式 3. 添加JS效果 【任务8-15】制作“页脚”模块 效果分析 1. 结构分析 2. 样式分析 模块制作 1. 搭建结构 2. 控制样式 【项目总结】 【课后练习】
