网页设计与Web前端开发案例教程：HTML5、CSS3、JavaScript

第一部分理论篇

第1章网页设计与Web前端基础

1.1Web概述

1.1.1Web的历史

1.1.2Web体系结构

1.1.3基本Web技术

1.1.4相关概念

1.2网页标准简介

1.2.1结构标准语言

1.2.2表现标准语言

1.2.3行为标准语言

1.3网站开发工作流程

1.3.1拟定网站主题

1.3.2规划网站架构与内容

1.3.3收集相关资料

1.3.4页面设计和布局规划

1.3.5网页制作、测试与上传

1.3.6网站的推广与更新维护

1.4Web开发工具

1.4.1Adobe Dreamweaver

1.4.2Sublime Text

1.4.3Notepad++

1.4.4EditPlus

1.4.5WebStorm

1.4.6Visual Studio Code

1.5习题

第2章HTML常用标签

2.1HTML5网页结构

2.1.1HTML的发展历程

2.1.2初识HTML标签

2.1.3HTML5文档的基本结构

2.1.4HTML文档主体标签

2.2网页文本

2.2.1注释标签

2.2.2段落和换行标签

2.2.3标题标签

2.2.4特定文字样式标签

2.2.5网页特殊字符

2.3图片标签及属性

2.3.1常见图片格式

2.3.2网页图片的四要素

2.4超链接标签

2.4.1超链接的基本格式

2.4.2URL链接

2.4.3本地链接

2.4.4书签链接

2.4.5下载文件链接

2.4.6邮件链接

2.5插入多媒体

2.5.1在外部窗口中播放多媒体

2.5.2在当前文档中播放音频

2.5.3在当前文档中播放视频

2.6习题







第3章使用CSS3样式表

3.1初识CSS样式表

3.1.1第一个CSS案例

3.1.2CSS基本语法

3.1.3CSS的创建

3.1.4组合选择器

3.1.5后代选择器

3.1.6类选择器的创建和引用

3.1.7id选择器的创建和引用

3.2盒模型

3.2.1盒模型的概念

3.2.2样式初始化

3.2.3边框属性

3.2.4内边距属性

3.2.5外边距属性

3.2.6外边距合并

3.2.7盒模型案例实践

3.3列表标签及样式

3.3.1无序列表

3.3.2有序列表

3.3.3定义列表

3.3.4列表样式

3.3.5列表样式案例实践

3.4元素的分类及转换

3.4.1块元素

3.4.2行内元素

3.4.3行内块元素

3.4.4元素类型的转换

3.4.5元素类型转换案例实践

3.5CSS的常用属性

3.5.1背景属性

3.5.2字体属性

3.5.3文本属性

3.5.4鼠标属性

3.5.5CSS常用属性案例实践

3.6高级选择器

3.6.1子元素选择器

3.6.2相邻元素选择器

3.6.3关联元素选择器

3.6.4属性选择器

3.6.5伪类选择器

3.6.6伪元素选择器

3.6.7高级选择器案例实践

3.7CSS继承与优先

3.7.1CSS样式继承

3.7.2选择器的优先级

3.7.3样式优先级

3.7.4CSS书写顺序

3.8常用CSS3属性

3.8.1圆角属性

3.8.2方框阴影属性

3.8.3文本阴影属性

3.8.4溢出属性

3.8.5可见性属性

3.8.6常用CSS3属性案例实践

3.9习题

第4章使用HTML+CSS布局网页

4.1CSS布局概述

4.1.1CSS布局相关概念

4.1.2CSS的3种定位机制

4.2元素的浮动

4.2.1浮动

4.2.2浮动的常规用法

4.2.3浮动的特殊情况

4.2.4与inlineblock的比较

4.2.5清除属性

4.2.6元素浮动案例实践

4.3元素的定位

4.3.1定位属性

4.3.2相对定位

4.3.3绝对定位

4.3.4固定定位

4.3.5zindex

4.3.6定位元素的居中

4.3.7元素定位案例实践

4.4图片及布局

4.4.1图片布局的几个概念

4.4.2水平对齐

4.4.3垂直对齐

4.4.4图片布局案例实践

4.5表单及布局

4.5.1表单的基本结构

4.5.2表单元素

4.5.3表单相关伪类

4.5.4表单布局案例实践

4.6表格及布局

4.6.1表格标签

4.6.2合并单元格

4.6.3表格的样式

4.6.4表格的特征

4.6.5表格布局及案例实践

4.7内联框架

4.7.1内联框架的基本用法

4.7.2内联框架布局案例实践

4.8CSS进阶应用

4.8.1网页logo应用

4.8.2阿里图标应用

4.8.3CSS代码复用

4.8.4CSS进阶应用案例实践

4.9PC端网页布局综合案例实战

4.10习题

第5章HTML5+CSS3移动网站布局

5.1HTML5新增标签

5.1.1HTML5概述

5.1.2HTML5结构性标签

5.1.3HTML5语义化标签

5.1.4HTML5网页案例实践

5.2CSS3新增伪类和伪元素

5.2.1以fisrt、last、only为前缀的伪类

5.2.2以nth为前缀的伪类

5.2.3其他伪类和伪元素

5.2.4CSS3新增伪类案例实践

5.3CSS3变形、过渡及动画

5.3.1变形

5.3.2过渡

5.3.3动画

5.3.4变形、过渡及动画案例实践

5.4CSS3新增属性

5.4.1新增背景属性

5.4.2新增颜色属性

5.4.3倒影

5.4.4遮罩

5.4.5CSS3新增属性案例实践

5.5CSS3弹性盒模型

5.5.1基本弹性盒模型设置

5.5.2弹性容器相关属性

5.5.3弹性项目相关属性

5.5.4怪异盒模型

5.5.5动态计算calc()

5.5.6弹性盒模型案例实践

5.6响应式布局和自适应布局

5.6.1媒体查询

5.6.2视口

5.6.3自适应布局

5.7移动端网页布局案例实战

5.8习题

第6章使用JavaScript脚本

6.1初识JavaScript

6.1.1JavaScript简介

6.1.2JavaScript的使用

6.1.3JavaScript代码规范

6.1.4弹窗与调试

6.1.5获取元素及操作内容

6.1.6简单认识DOM0级事件

6.1.7定义变量

6.1.8JS基本应用案例实践

6.2JavaScript的基本元素

6.2.1数据类型

6.2.2常量

6.2.3运算符和表达式

6.2.4数据类型转换

6.3操作浏览器对象属性及CSS样式

6.3.1操作对象属性

6.3.2操作对象属性案例实践

6.3.3操作CSS样式

6.3.4操作CSS样式案例实践

6.4JavaScript的条件语句

6.4.1if语句

6.4.2switch语句

6.4.3条件语句案例实践

6.5JavaScript的循环语句

6.5.1for循环语句

6.5.2while循环语句

6.5.3do…while循环语句

6.5.4break和continue语句

6.5.5循环语句案例实践

6.6使用JavaScript函数

6.6.1函数分类

6.6.2函数参数

6.6.3返回语句

6.6.4变量的作用域

6.6.5JS函数案例实践

6.7JavaScript对象的操作语句

6.7.1with语句

6.7.2for…in语句

6.7.3对象关键字及操作符

6.8JavaScript常用内置对象

6.8.1数组对象

6.8.2字符串对象

6.8.3数学对象

6.8.4日期对象

6.9DOM对象及操作

6.9.1HTML DOM简介

6.9.2HTML中的节点类型

6.9.3DOM节点的访问

6.9.4DOM节点的操作

6.9.5DOM对象案例实践

6.10BOM对象及操作

6.10.1BOM简介

6.10.2窗口对象

6.10.3文档对象

6.10.4位置对象

6.10.5历史对象

6.10.6浏览器信息对象

6.11localStorage对象及操作

6.11.1HTML5 Web存储简介

6.11.2localStorage对象的基本用法

6.11.3本地存储案例实践

6.12Web交互开发案例实战

6.13习题

第7章图形绘制

7.1初识Canvas

7.2Canvas的坐标系统

7.3添加Canvas元素

7.4Canvas绘制环境

7.5绘图API

7.5.1绘制路径

7.5.2渐变色的使用

7.5.3图形变换

7.5.4绘制环境的保存与恢复

7.5.5绘制图像

7.5.6绘制文本

7.6动画制作

7.7时钟案例实战

7.8习题

第二部分应用篇

第8章网站设计综合实训

8.1网站的规划

8.1.1网站设计项目书的书写

8.1.2网站的主要规划过程及创建

8.2网站的素材准备及管理

8.3网页外观设计及布局

8.3.1网页外观布局方法

8.3.2网页布局的方案

8.4向页面添加内容

8.5使用CSS设置页面

8.6添加网页特效及功能

8.6.1添加网页特效

8.6.2添加网页功能

8.7站点的本地测试

8.7.1运行站点报告

8.7.2检查站点范围的链接

8.8发布及维护Web站点

8.8.1上传文件

8.8.2获取网站地址

8.8.3实机测试

8.8.4日常维护

8.9课程设计及要求

8.9.1课程设计的基本目的

8.9.2课程设计的基本要求

8.9.3课程设计的考核方式与评分方法

第9章课业拓展

9.1浏览器开发者工具

9.1.1浏览器开发者工具简介

9.1.2激活工具栏

9.1.3选择元素与Element标签

9.1.4Console标签栏

9.1.5Network标签栏

9.1.6Source标签栏

9.2jQuery库

9.2.1jQuery简介

9.2.2jQuery基础用法

9.2.3文档参考

9.3Bootstrap框架

9.3.1Bootstrap简介

9.3.2Bootstrap快速上手

9.4架设互联网网站

9.4.1域名服务

9.4.2主机托管

9.4.3虚拟主机

9.5云服务

9.5.1阿里云虚拟主机

9.5.2阿里云ECS

附录书中视频对应二维码汇总表

参考文献

专题学习资源网址