图书简介:
第1章 HTML5基础知识 1
1.1 Web技术和浏览器 1
1.2 Web标准 1
1.2.1 什么是Web标准 1
1.2.2 建立Web标准的优点 2
1.2.3 理解表现和结构相分离 2
1.3 HTML5概述 3
1.3.1 Web技术发展历程 3
1.3.2 HTML5的特性 4
1.3.3 HTML5元素 4
1.4 HTML5的基本结构 5
1.4.1 HTML5语法结构 5
1.4.2 HTML5编写规范 6
1.4.3 HTML5文档结构 6
1.5 创建HTML文件 7
1.6 搭建支持HTML5的浏览器
环境 8
1.7 网页头部标签 9
1.8 注释 11
1.9 特殊符号 11
习题1 12
第2章 编辑网页元素 13
2.1 文本元素 13
2.2 文本层次语义元素 15
2.3 基本排版元素 17
2.4 图像 21
2.4.1 网页图像的格式及使用
要点 21
2.4.2 图像标签 22
2.4.3 设置网页背景图像 24
2.4.4 图文混排 24
2.4.5 案例—制作天地环保
“关于我们”图文混排
页面 25
2.5 超链接 26
2.5.1 超链接概述 26
2.5.2 超链接的应用 26
2.5.3 案例—制作天地环保
“下载专区”页面 30
2.6 列表 32
2.6.1 无序列表 32
2.6.2 有序列表 33
2.6.3 定义列表 34
2.6.4 嵌套列表 35
2.7 <div>标签 35
2.8 <span>标签 36
2.9 综合案例—制作天地环保
“公司名片”页面 37
习题2 38
第3章 页面的布局与交互 40
3.1 表格 40
3.1.1 表格的结构 40
3.1.2 表格的基本语法 40
3.1.3 表格的属性 41
3.1.4 不规范表格 43
3.1.5 表格数据的分组 44
3.1.6 表格的嵌套 46
3.1.7 案例—使用表格布局
天地环保“工程展示”
页面 46
3.2 使用结构元素构建网页布局 47
3.3 页面交互元素 53
3.3.1 details元素和summary
元素 53
3.3.2 progress元素 54
3.3.3 meter元素 54
3.4 表单 55
3.4.1 表单的基本概念 55
3.4.2 表单标签 55
3.4.3 表单元素 56
3.4.4 案例—制作天地环保
“会员注册”表单 60
3.4.5 表单分组 61
3.4.6 使用表格布局表单 62
3.4.7 表单的高级用法 63
习题3 64
第4章 CSS3基础 66
4.1 CSS概述 66
4.2 CSS的优势与局限性 68
4.3 CSS语法基础 70
4.3.1 CSS样式规则 70
4.3.2 基本选择符 71
4.3.3 复合选择符 73
4.3.4 通配符选择符 75
4.3.5 特殊选择符 76
4.4 CSS的属性单位 77
4.4.1 长度、百分比单位 78
4.4.2 色彩单位 78
4.5 网页中引用CSS的方法 79
4.5.1 行内样式 79
4.5.2 内部样式表 80
4.5.3 链入外部样式表 81
4.5.4 导入外部样式表 82
4.5.5 案例—制作“天地环保
工程简介”页面 83
4.6 文档结构 85
4.6.1 文档结构的基本概念 85
4.6.2 继承 86
4.6.3 样式表的层叠、特殊性
与重要性 87
4.6.4 元素类型 88
4.6.5 案例—制作天地环保
“核心业务”局部页面 89
习题4 90
第5章 盒模型 91
5.1 盒模型简介 91
5.2 盒模型的属性 92
5.2.1 边框 92
5.2.2 外边距 95
5.2.3 内边距 96
5.2.4 案例—盒模型的演示 97
5.3 盒模型的大小 98
5.3.1 盒模型的宽度与高度 98
5.3.2 设置块级元素与行级
元素的宽度和高度 98
5.4 盒模型综合案例—“天地环保”
页面顶部内容 99
5.5 盒子的定位 101
5.5.1 定位属性 101
5.5.2 定位方式 103
5.6 浮动与清除浮动 106
5.6.1 浮动 106
5.6.2 清除浮动 109
5.6.3 案例—天地环保“登录”
页面的整体布局 110
习题5 112
第6章 使用CSS修饰页面外观 113
6.1 设置字体样式 113
6.2 设置文本样式 115
6.3 设置图像样式 118
6.3.1 图像缩放 119
6.3.2 图像边框 120
6.3.3 图像的不透明度 121
6.3.4 背景图像 121
6.3.5 背景重复 122
6.3.6 背景图像定位 123
6.3.7 设置背景图像固定 125
6.3.8 背景图像大小 125
6.4 设置表格样式 126
6.4.1 常用的CSS表格属性 126
6.4.2 案例—使用隔行换色
表格制作“环保工程年度
排行榜” 128
6.5 设置表单样式 129
6.5.1 使用CSS修饰常用的
表单元素 130
6.5.2 案例—制作“天地环保
用户调查”页面 131
6.6 设置链接 133
6.6.1 设置文字链接的外观 133
6.6.2 图文链接 135
6.7 设置列表 136
6.7.1 表格布局的缺点 136
6.7.2 列表布局的优势 136
6.7.3 CSS列表属性 136
6.7.4 案例—制作天地环保
二维码名片 140
6.8 创建导航菜单 141
6.9 综合案例—制作“绿色环保”
社区页面 144
习题6 151
第7章 CSS布局技术 152
7.1 Div+CSS布局技术简介 152
7.2 使用嵌套的Div布局页面 153
7.2.1 将页面用Div分块 153
7.2.2 案例—制作“环保空间”
页面 153
7.3 典型的CSS布局样式 156
7.3.1 两列布局样式 156
7.3.2 三列布局样式 159
7.4 综合案例—制作天地环保
“博客”页面 162
习题7 170
第8章 JavaScript程序设计基础 171
8.1 JavaScript概述 171
8.2 在网页中使用JavaScript 171
8.3 JavaScript基本语法 174
8.4 JavaScript的程序结构 176
8.4.1 简单语句 176
8.4.2 程序控制流程 178
8.5 函数 181
8.6 基于对象的JavaScript语言 183
8.7 DOM编程 185
8.7.1 window对象 186
8.7.2 document对象 187
8.7.3 location对象 189
8.7.4 history对象 190
8.7.5 form对象 190
8.8 JavaScript的对象事件处理
程序 191
8.8.1 对象的事件 191
8.8.2 常用的事件及处理 191
8.8.3 表单对象与交互性 194
8.9 综合案例—Web页面信息
交互 196
习题8 197
第9章 HTML5的高级应用 199
9.1 HTML5拖放API 199
9.1.1 draggable属性 199
9.1.2 拖放触发的事件和数据
传递 200
9.2 多媒体播放 202
9.2.1 HTML5的多媒体支持 202
9.2.2 音频标签 203
9.2.3 视频标签 204
9.2.4 HTML5多媒体API 205
9.3 Canvas绘图 207
9.3.1 创建<canvas>元素 207
9.3.2 构建绘图环境 208
9.3.3 通过JavaScript绘制
图形 208
9.4 HTML5地理定位API 216
9.4.1 Geolocation基础 216
9.4.2 Geolocation API实现
地理定位 217
9.4.3 案例—使用HTML5
获取地理位置及百度
地图 218
9.5 HTML5的发展前景 221
习题9 221
第10章 jQuery基础 222
10.1 jQuery概述 222
10.2 编写jQuery程序 223
10.3 jQuery对象和DOM对象 224
10.3.1 jQuery对象和DOM
对象简介 224
10.3.2 jQuery对象和DOM
对象的相互转换 225
10.4 jQuery插件 228
10.5 jQuery选择器简介 228
10.6 基础选择器 229
10.7 层次选择器 234
10.8 过滤选择器 237
10.9 表单选择器 241
10.10 jQuery的基本操作 242
10.10.1 元素属性的操作 242
10.10.2 元素样式的操作 245
10.10.3 元素内容和值的
操作 247
习题10 249
第11章 jQuery的动画效果 251
11.1 jQuery的动画方法简介 251
11.2 显示与隐藏效果 252
11.3 淡入/淡出效果 255
11.4 滑动效果 258
11.5 综合案例—制作折叠式
导航菜单 260
习题11 262
第12章 jQuery UI插件的用法 263
12.1 jQuery UI概述 263
12.2 jQuery UI的常用插件 267
12.2.1 日期选择器插件 267
12.2.2 折叠面板插件 268
12.2.3 标签页插件 271
12.2.4 自动完成插件 272
习题12 275
第13章 天地环保综合案例网站 277
13.1 网站的开发流程和组织结构 277
13.1.1 网站的开发流程 277
13.1.2 创建站点目录 278
13.1.3 网站页面的组成 279
13.2 网站技术分析 279
13.3 制作网站首页 280
13.4 制作联系我们页面 291
13.5 实训网站 292
习题13 292
展开
随着HTML5规范的日臻完善和普及,Web前端开发技术也越来越引人注目,如何开发Web应用程序,设计精美、独特的网页已经成为当前的热门技术之一。许多高校的相关专业都开设了网页制作及程序开发类课程。
为适应现代技术的飞速发展,培养出技术能力强、能快速适应网站开发行业需求的高级技能型人才,帮助众多喜爱网站开发的人员提高网站的设计及编码水平,作者结合自己多年从事教学工作和Web应用开发的实践经验,按照教学规律精心编写了本书。
本书基于Web标准,深入浅出地介绍了Web前端设计技术的基础知识,对Web标准、HTML5、CSS3、JavaScript、jQuery和网站制作流程进行了详细的讲解。本书围绕Web标准的三大关键技术(HTML、CSS和JavaScript/jQuery)来介绍网页编程的必备知识及相关应用。其中,HTML负责网页结构,CSS负责网页样式及表现,JavaScript/jQuery负责网页行为和功能。目前,很多高校的计算机专业和IT培训班都将HTML5+CSS3+JavaScript+jQuery作为教学内容之一,这对培养学生的计算机应用能力具有非常重要的意义。
本书采用“模块化设计、任务驱动学习”的编写模式,实现任务驱动学习的关键是“任务”的设计,它必须是社会实际生产、生活中的一个真实问题。为了解决这个问题,需要把它分解成一系列的“子任务”;每个子任务的解决过程就是一个模块的学习过程。每个模块学习一组概念、锻炼一组技能;全部模块加起来,即完成一种知识的学习,形成一种相应的能力。
在任务驱动学习的具体实施中,以网站建设和网页设计为中心,以实例为引导,把介绍知识与实例设计、制作、分析融于一体,自始至终贯穿于本书之中。在实例的设计、制作过程中,把各章节的知识点融于实例之中,使读者能够快速掌握相关概念和操作方法。考虑到网页制作较强的实践性,本书配备大量的页面例题和丰富的运行效果图,能够有效地帮助读者理解所学习的理论知识,系统全面地掌握网页制作技术。本书的主要特色如下。
(1)基于Web标准,所有案例都通过了W3C标准检验。
(2)本书通过对天地环保网站的完整讲解,将相关知识点分解到案例实例网站的具体制作环节中,针对性强。同时提供了许多案例,具有可操作性。
(3)语言通俗易懂、简单明了,读者能够轻松地掌握有关知识。
(4)知识结构安排合理、循序渐进,适合教师教学与学生自学。
本书以天地环保网站的设计与制作为主线,围绕网站栏目的设计,详细、全面、系统地介绍网页制作、设计、规划的基本知识及网站开发的完整流程。本书所有例题、习题及上机实训均采用案例驱动的讲述方式,通过大量实例深入浅出、循序渐进地引导读者学习。本书在每章后面附有大量的实践操作习题,并在教学课件中给出习题答案,供读者在课外巩固所学的内容。
本书共分13章,主要内容包括HTML5基础知识、编辑网页元素、页面的布局与交互、CSS3基础、盒模型、使用CSS修饰页面外观、CSS布局技术、JavaScript程序设计基础、HTML5的高级应用、jQuery基础、jQuery的动画效果、jQuery UI插件的用法和天地环保综合案例网站。
本书条理清晰、内容完整、实例丰富、图文并茂、系统性强,不仅可以作为高等学校计算机及相关专业课程的教材,也可以作为网站建设、相关软件开发人员和计算机爱好者的参考书。
全书由张晓蕾担任主编并定稿,由刘瑞新教授担任主审。
参加本书编写的作者的分工如下:张晓蕾编写第1~5章,吕振雷编写第6章和第8章,马海洲编写第7章和第9章,莫丽娟编写第10章,高欣编写第11章,第12、13章及教学资源的制作由刘克纯、骆秋容、刘大学、缪丽丽、陈文娟、李继臣、孙明建、李索、刘有荣、李刚、徐维维、徐云林、曹媚珠、陈文焕、沙世雁、田金凤、王茹霞、田同福等共同完成。参加编写的大部分人员是具有多年计算机教学与培训经验的教师。
由于作者水平有限,书中难免有不足之处,恳请读者提出宝贵意见和建议。
编 者
展开