网页设计与制作：Web前端开发（第3版）

目录

项目1网页制作基础知识

1.1项目描述及分析

1.2任务1优秀网站赏析

1.3任务2网页基础知识

1.3.1网页和网站的基本概念

1.3.2网页的组成元素

1.3.3网页相关名词

1.3.4Web标准

1.3.5响应式Web设计

1.4任务3网站建设的一般流程

1.4.1确定网站主题

1.4.2规划网站结构

1.4.3收集资料与素材

1.4.4确定版面布局方式

1.4.5制作网页

1.4.6测试与发布网站

1.4.7推广网站

1.4.8网站的后期维护

1.5网页制作入门

1.5.1HTML5简介

1.5.2CSS3简介

1.5.3JavaScript简介

1.5.4常见浏览器

1.6网页制作常用开发工具简介

1.6.1网页制作与编辑工具

1.6.2页面设计与美化工具

1.7知识链接

1.7.1网页制作的基本原则

1.7.2认识图像

1.7.3常见的建站方式

实训

项目2制作简单网页

2.1项目描述及分析

2.2任务1进行网站功能设计

2.3任务2设计网站首页原型

2.3.1认识Photoshop

2.3.2制作首页原型

2.3.3首页原型的切片与导出

2.4任务3网页的制作与上传

2.4.1认识HBuilder

2.4.2HBuilder入门

2.4.3域名和空间的申请

2.4.4网站文件的上传

2.5知识链接

2.5.1网页中的色彩

2.5.2网页基本元素的标准和使用技巧

实训

项目3“太阳岛”旅游网站制作

3.1项目描述及分析

3.2任务1添加文本

3.3任务2认识HTML

3.3.1HTML文档基本格式

3.3.2认识HTML标签

3.3.3HTML常用标签

3.4任务3编辑文本

3.4.1全国免费电话文本设置

3.4.2最新动态行文本编辑

3.5任务4认识CSS.59

3.5.1认识CSS样式表

3.5.2创建并使用CSS样式优化网页源码

3.6任务5设计网站子页

3.7知识链接——CSS控制文本样式

3.8拓展学习——旅游类网站的设计要点

3.8.1旅游类网站的类型

3.8.2旅游类网站的设计

要点

实训

项目4“盟院合作”专题网站制作

4.1项目描述及分析

4.2任务1认识盒子模型

4.3盒子模型相关属性

4.3.1盒子边框属性

4.3.2内边距属性

4.3.3外边距属性

4.3.4背景属性

4.3.5盒子的宽与高

4.4浮动与定位

4.4.1元素的浮动

4.4.2元素的定位

4.5项目制作

4.5.1页面布局及定义基础样式99

4.5.2页眉制作

4.5.3“主体”模块制作

4.5.4页脚制作

4.6知识链接——补充CSS选择器

4.7拓展学习——专题网站制作的设计要点

实训

项目5“艾上乐品”服装网站制作

5.1项目描述及分析

5.2任务1列表标记及嵌套

5.2.1列表标记

5.2.2列表的嵌套

5.3任务2CSS控制列表样式

5.4任务3认识表格标记

5.4.1表格标记

5.4.2CSS控制表格样式

5.5项目制作

5.5.1页面布局及定义基础样式

5.5.2制作“头部”导航模块

5.5.3制作banner模块和“精品展示”模块

5.5.4制作“版权信息”模块

5.6知识链接——浏览器兼容性

5.7拓展学习——流行时尚类网站的设计要点

实训

项目6影音网站制作

6.1任务1了解HTML5多媒体的特性

6.2任务2了解HTML5常用的多媒体格式

6.2.1音频格式

6.2.2视频格式

6.3任务3HTML5多媒体的实现

6.3.1audio标签

6.3.2video标签

6.3.3source标签

6.4任务4HTML5表单的应用

6.4.1认识表单

6.4.2HTML5新增的表单属性

6.4.3HTML5标签

6.5任务5影音网站项目描述及分析

6.6任务6添加多媒体文件

6.6.1添加音频文件

6.6.2添加视频文件

6.6.3添加留言模块

6.7知识链接——音频/视频

DOM参考手册

实训

项目7“我要回家网”页面制作

7.1项目描述及分析

7.2任务1JavaScript概述

7.2.1JavaScript简介

7.2.2JavaScript引入方式

7.2.3JavaScript基本语法

7.2.4一个简单的JavaScript程序

7.3任务2JavaScript语言基础

7.3.1关键字和标识符

7.3.2变量和数据类型

7.3.3运算符和表达式

7.4任务3程序流程控制

7.4.1条件语句

7.4.2循环语句

7.4.3跳转语句

7.5任务4函数

7.5.1初识函数

7.5.2函数的调用

7.5.3函数中变量的作用域

7.6任务5结构布局及样式定义

7.6.1准备工作

7.6.2制作思路分析

7.6.3页面结构设计

7.6.4基础样式定义

7.6.5CSS/JS文件引入

7.7任务6制作“头部”版块

7.7.1“头部”版块效果分析

7.7.2“头部”版块制作

7.8任务7制作“导航”版块

7.8.1“导航”版块效果分析

7.8.2“导航”版块制作

7.9任务8制作banner版块和“时间”版块

7.9.1banner版块和“时间”版块效果分析

7.9.2banner版块和“时间”版块制作

7.10任务9制作“客运信息”版块

7.10.1“客运信息”版块效果分析

7.10.2“客运信息”版块制作

7.11任务10制作“底部”版块

7.11.1“底部”版块效果分析

7.11.2“底部”版块制作

7.12拓展学习——业务类网站的设计要点

7.12.1业务类网站的类型

7.12.2业务类网站的设计要点

实训

项目8“延庆外国语学校”页面制作

8.1项目描述及分析

8.2任务1认识对象

8.2.1什么是对象

8.2.2对象的属性和方法

8.2.3创建和删除对象

8.2.4内置对象

8.3任务2数组对象

8.3.1初识数组

8.3.2数组的常见操作

8.3.3数组的常用属性和方法

8.3.4二维数组

8.4任务3BOM和DOM对象

8.4.1BOM对象

8.4.2DOM对象

8.5任务4事件处理

8.5.1什么是事件

8.5.2事件处理程序的调用

8.5.3鼠标事件

8.5.4键盘事件

8.5.5表单事件

8.5.6页面事件

8.6任务5布局及定义基础样式

8.6.1准备工作

8.6.2制作思路分析

8.6.3页面结构设计

8.6.4基础样式定义

8.6.5CSS/JS文件引入

8.7任务6制作“头部及导航”版块

8.7.1“头部”版块效果分析

8.7.2“头部”版块制作

8.8任务7制作banner版块

8.8.1banner版块效果分析

8.8.2banner版块制作

8.9任务8制作“学校简介”版块

8.9.1“学校简介”版块效果分析

8.9.2“学校简介”版块制作

8.10任务9制作“课程特色”版块

8.10.1“课程特色”版块效果分析

8.10.2“课程特色”版块制作

8.11任务10制作“页脚”版块

8.11.1“页脚”版块效果分析

8.11.2“页脚”版块制作

8.12拓展学习——教育类网站的设计要点

8.12.1教育类网站的类型

8.12.2教育类网站的设计要点

实训

项目9网站动态化

9.1项目描述及分析

9.2任务1认识CMS

9.2.1静态网页与动态网页

9.2.2CMS

9.3任务2静态页面模板导入

9.3.1DedeCMS的安装和环境配置

9.3.2静态页面模板导入

9.3.3模板的相关概念

9.4任务3DedeCMS常用标签

9.4.1了解DedeCMS中的标签

9.4.2DedeCMS中的常用标签

9.5任务4首页动态化

9.5.1网站栏目管理

9.5.2首页动态化

9.6任务5其他页面动态化

9.6.1列表页（栏目页）动态化

9.6.2内容页动态化

9.7任务6生成静态页面

9.8知识链接——数据备份与还原

实训

项目10响应式Web设计

10.1项目描述及分析

10.2任务1认识响应式布局

10.2.1设计理念

10.2.2响应式的实现

10.3任务2响应式布局基础知识

10.3.1响应式设计相关概念

10.3.2响应式布局的实现

10.4任务3响应式布局框架

10.4.1常见的响应式布局框架

10.4.2Bootstrap简介

10.5任务4认识Bootstrap

10.5.1相关概念

10.5.2CSS布局

10.5.3组件

10.6任务5页面响应式布局

10.6.1项目需求

10.6.2头部响应式布局

10.6.3主体部分响应式布局

10.6.4页脚部分响应式布局

10.6.5测试页面

10.7知识链接——Bootstrap中的其他组件

10.7.1表单

10.7.2复选框和单选按钮

10.7.3卡片

实训

参考文献