Web前端开发技术与案例教程

前言
第1章 Web开发基础1
1.1 WWW简介1
1.1.1 WWW概述1
1.1.2 统一资源定位符（URL）2
1.1.3 WWW的文档2
1.2 Web页面设计技术3
1.2.1 HTML简介3
1.2.2 CSS简介3
1.2.3 JavaScript简介3
1.3 Web开发与发布4
1.3.1 DreamWeaver简介4
1.3.2 DreamWeaver使用4
1.3.3 Web网站发布8
习题10
第2章 HTML基础11
2.1 HTML文档11
2.1.1 HTML标签11
2.1.2 HTML元素12
2.1.3 HTML属性14
2.1.4 HTML文档的基本结构18
2.2 网页文字设计21
2.2.1 文本设计21
2.2.2 列表26
2.2.3 表格27
2.2.4 语义元素31
2.3 建立超链接32
2.3.1 超链接的概念32
2.3.2 绝对路径和相对路径32
2.3.3 定义超链接33
2.3.4 命名锚点34
2.4 网页表单设计35
2.4.1 创建表单35
2.4.2 input元素创建控件36
2.4.3 其他常用控件42
2.4.4 HTML5 新的表单元素43
习题45
第3章 HTML进阶46
3.1 网页多媒体设计46
3.1.1 图像46
3.1.2 声音和视频49
3.1.3 内联框架52
3.1.4 对象53
3.2 图形绘制与数学公式54
3.2.1 Canvas绘图54
3.2.2 SVG绘图60
3.2.3 MathML数学符号和公式62
3.3 网页布局62
3.3.1 使用div元素的网页布局63
3.3.2 HTML5网页布局64
3.4 HTML5 用户接口API68
3.4.1 HTML5拖放与通知68
3.4.2 HTML5地理定位73
3.5 案例—个人博客主页75
习题81
第4章 HTML综合案例—萌宠
之家83
4.1 基本页面布局83
4.2 各页面设计84
4.2.1 主页面84
4.2.2 aboutUs页面87
4.2.3 services页面89
4.2.4 team页面91
4.2.5 gallery页面93
4.2.6 contact页面95
第5章 CSS基础97
5.1 CSS的作用97
5.2 CSS的使用方法99
5.2.1 如何编写CSS99
5.2.2 CSS的基础语法99
5.2.3 应用CSS的方法101
5.2.4 CSS的层次结构102
5.3 CSS的选择器103
5.3.1 类型选择器103
5.3.2 类选择器104
5.3.3 ID选择器104
5.3.4 结合类型选择器104
5.3.5 后代选择器105
5.3.6 多重选择器106
5.4 CSS的基础样式107
5.4.1 背景（background）107
5.4.2 文本格式（text）108
5.4.3 字体属性（fonts）110
5.4.4 链接（link）112
5.4.5 列表（list）113
5.5 案例—人物信息卡片115
习题119
第6章 CSS进阶121
6.1 CSS高阶选择器121
6.1.1 子选择器121
6.1.2 相邻兄弟选择器122
6.1.3 属性选择器123
6.2 CSS伪类及伪元素125
6.2.1 CSS伪类125
6.2.2 CSS伪元素127
6.3 CSS布局基础129
6.3.1 CSS框模型129
6.3.2 定位机制（Position）133
6.3.3 浮动属性（Float）136
6.4 CSS响应式页面设计138
6.4.1 什么是响应式页面设计138
6.4.2 响应式网页设计-视口139
6.4.3 响应式网页设计-网格视图141
6.4.4 响应式网页设计-媒体查询144
6.5 CSS3新特性146
6.5.1 CSS3新的边框属性146
6.5.2 CSS3新的背景属性148
6.5.3 CSS3 文本阴影151
6.6 案例—响应式布局151
习题157
第7章 CSS综合案例——计算器158
7.1 计算器的设计158
7.1.1 页面原型设计158
7.1.2 计算器页面布局159
7.2 计算器基本样式设置163
7.2.1 设置计算器主体样式163
7.2.2 设置计算机标题样式164
7.2.3 设置显示屏样式164
7.2.4 设置按钮的样式165
7.3 计算器进阶样式设置167
7.3.1 设置显示框字体167
7.3.2 设置按钮渐变及阴影168
7.3.3 设置鼠标单击特效169
7.3.4 效果展示及后续工作170
第8章 JavaScript入门174
8.1 JavaScript基础174
8.2 JavaScript基本语法175
8.2.1 数据176
8.2.2 操作符177
8.2.3 语句179
8.3 JavaScript对象186
8.3.1 内置对象186
8.3.2 自定义对象191
8.3.3 BOM对象192
8.3.4 DOM对象197
8.4 JavaScript事件200
8.4.1 常用事件200
8.4.2 事件添加201
8.4.3 基本功能实现203
8.4.4 调试205
习题209
第9章 JavaScript进阶210
9.1 jQuery210
9.1.1 jQuery选择器211
9.1.2 jQuery操作样式表221
9.1.3 jQuery操作文档225
9.1.4 jQuery事件234
9.1.5 jQuery效果238
9.1.6 jQuery Ajax240
9.2 eCharts241
9.2.1 eCharts概述242
9.2.2 eCharts基本使用242
9.2.3 eCharts API244
9.2.4 eCharts组件250
9.3 案例254
9.3.1 HTML基本结构与CSS基本样式254
9.3.2 jQuery效果处理256
习题259
第10章 JavaScript综合案例——学校
信息管理系统260
10.1 系统页面设计260
10.1.1 页面框架设计260
10.1.2 年级概况页面实现262
10.1.3 班级概况页面设计263
10.1.4 成绩管理页面设计268
10.1.5 学生管理页面设计271
10.1.6 后台管理页面设计274
10.2 系统功能实现275
10.2.1 页面框架功能实现275
10.2.2 年级概况页面实现277
10.2.3 班级概况功能实现287
10.2.4 成绩管理功能实现290
10.2.5 学生管理功能实现294

10.2.6 后台管理功能设计296
第11章 网络学院教学考评中心网站的
实现298
11.1 创建网站298
11.1.1 网站代码结构299
11.1.2 网页规