黑马程序员技术交流社区

标题: 网页设计与制作项目教程(HTML+CSS+JavaScript) [打印本页]

作者: 庭院深深深几许    时间: 2019-4-25 17:04
标题: 网页设计与制作项目教程(HTML+CSS+JavaScript)
《网页设计与制作项目教程》内容简介
本书针对网页设计与制作的初学者,以项目+任务式的编写体例规划理论知识点,并用实际的操作展示学习过程,通过实际的操作让学生掌握项目中的技能点(知识技能—>过程方法—>职业技能)。全面贯彻“理论→实例→实验实训→综合评价”4阶段教学模式。在内容选择、结构安排上更加符合高职学生的认知习惯,从而达到老师易教、学生易学的目的。
全书分为8个项目,结合HTML、CSS和JavaScript的基础知识及应用,提供了7种不同类型的网页设计案例。其中,项目1主要讲解HTML、CSS以及JavaScript的基础知识,包括Web基本概念、HTML/CSS/JavaScript简介、Dreamweaver工具的使用等。项目2至项目8为7个完整的网页设计项目,涉及“旅游”、“网店”、“儿童摄影”、“教育”、“服装”、“美食”等多个方向,有助于学生掌握不同网站的设计风格和制作技巧。全书以项目为导向,通过项目将章节知识点串起来,学完一章内容就能制作一个完整的项目页面,能大大激发学生的学习兴趣。
本书附有配套视频、源代码、习题、教学课件等资源,而且为了帮助初学者更好地学习本书讲解的内容,还提供了在线答疑,希望得到更多读者的关注。
《网页设计与制作项目教程》适合群体
本书既可作为高等院校本、专科相关专业的网页设计与制作课程的教材,也可作为前端与移动开发的培训教材,对于广大网站开发人员来说,更是一本不可多得的阅读与参考的优秀读物。
图书特色
特色1:项目贯始终
全书以项目为导向,通过项目将章节知识点串起来,学完一章内容就能制作一个完整的项目页面,能大大激发学生的学习兴趣。
特色2:项目丰富
全书包含7个完整的项目,涉及“旅游专题页”、“网上花店”、“儿童摄影”、“教育网站首页”等多个方向,有助于学生掌握不同网站的设计风格和制作技巧。
特色3:通俗易懂
采用比较直接的语言对知识点进行描述,且配合案例演示知识点的应用场景。
特色4:知识点细且全
包含HTML、CSS、JavaScript,体系完整循序渐进。
特色5:配套资源丰富

PPT、教学设计、习题、辅助案例、教学视频等,您需要的我们都有!
图书目录
项目1 网页制作基础知识 1
【任务1-1】 了解Web基本概念 2
需求分析 2
知识储备 2
1.认识网页 2
2.网页相关名词 4
3.Web标准 5
【任务1-2】 网页制作入门 6
需求分析 6
知识储备 6
1.HTML简介 6
2.CSS简介 8
3.JavaScript简介 9
4.常见浏览器介绍 9
【任务1-3】 Dreamweaver工具的
使用 11
需求分析 11
知识储备 11
1.Dreamweaver界面介绍 11
2.Dreamweaver初始化设置 15
3.创建第一个网页 17
【项目总结】 19
【课后练习】 19
项目2 “说旅游”专题页制作 21
【项目描述】 22
【任务2-1】 认识HTML 23
需求分析 23
知识储备 23
1.HTML文档基本格式 23
2.HTML标记 24
3.标记的属性 26
4.HTML文档头部相关标记 27
【任务2-2】 HTML文本控制标记 29
需求分析 29
知识储备 29
1.标题和段落标记 29
2.文本样式标记(font) 32
3.文本格式化标记 33
4.特殊字符标记 34
知识拓展 35
【任务2-3】 HTML图像标记 36
需求分析 36
知识储备 36
1.常用图像格式 36
2.图像标记 37
3.相对路径与绝对路径 40
知识拓展 41
【任务2-4】 准备工作与页面布局 42
准备工作 42
页面结构分析 44
页面布局 45
【任务2-5】 制作“头部”模块 46
效果分析 46
模块制作 46
【任务2-6】 制作“伊露岛介绍”模块 47
效果分析 47
模块制作 47
【任务2-7】 制作“伊露岛推荐”
模块 48
效果分析 48
模块制作 49
【任务2-8】 制作“驴友评论”模块 50
效果分析 50
模块制作 51
【任务2-9】 制作“页脚”模块 52
效果分析 52
模块制作 53
【项目总结】 54
【课后练习】 54
项目3 “网上花店”专题页制作 56
【项目描述】 57
【任务3-1】 CSS核心基础 58
需求分析 58
知识储备 58
1.CSS样式规则 58
2.引入CSS样式表 59
3.CSS基础选择器 63
【任务3-2】 CSS控制文本样式 65
需求分析 65
知识储备 65
1.CSS字体样式属性 65
2.CSS文本外观属性 68
知识拓展 71
【任务3-3】 CSS高级特性 71
需求分析 71
知识储备 72
1.CSS复合选择器 72
2.CSS层叠性与继承性 74
3.CSS优先级 75
【任务3-4】 布局及定义基础样式 78
准备工作 78
效果分析 79
定义基础样式 80
【任务3-5】 制作“标题”模块 81
效果分析 81
模块制作 81
【任务3-6】 制作“分类”模块 82
效果分析 82
模块制作 83
【任务3-7】 制作“热卖”模块 84
效果分析 84
模块制作 85
【任务3-8】 制作“页脚”模块 86
效果分析 86
模块制作 87
【项目总结】 88
【课后练习】 88
项目4 “青春树儿童摄影网”首页
制作 91
【项目描述】 92
【任务4-1】 认识盒子模型 93
需求分析 93
知识储备 93
认识盒子模型 93
【任务4-2】 盒子模型相关属性 94
需求分析 94
知识储备 95
1.边框属性 95
2.内边距属性 100
3.外边距属性 101
4.背景属性 103
5.盒子的宽与高 107
【任务4-3】 元素的类型与转换 108
需求分析 108
知识储备 109
1.元素的类型 109
2.标记 111
3.元素的转换 112
知识拓展 114
【任务4-4】 元素的浮动 116
需求分析 116
知识储备 117
1.元素的浮动属性 117
2.清除浮动 119
3.overflow属性 124
【任务4-5】 元素的定位 126
需求分析 126
知识储备 126
1.元素的定位属性 126
2.静态定位 126
3.相对定位 127
4.绝对定位 128
5.固定定位 129
6.z-index层叠等级属性 129
【任务4-6】 布局及定义基础样式 130
准备工作 130
效果分析 131
定义基础样式 131
【任务4-7】 制作“导航”及“banner”
模块 132
效果分析 132
模块制作 133
【任务4-8】 制作“最新动态”模块 135
效果分析 135
模块制作 135
【任务4-9】 制作“样片欣赏”模块 137
效果分析 137
模块制作 138
【任务4-10】 制作“页脚”及“悬浮框”
模块 139
效果分析 139
模块制作 139
【项目总结】 140
【课后练习】 140
项目5 “穿搭速递”首页制作 142
【项目描述】 143
【任务5-1】 列表标记 143
需求分析 143
知识储备 144
1.无序列表ul 144
2.有序列表ol 144
3.定义列表dl 145
4.列表的嵌套应用 146
【任务5-2】 CSS控制列表样式 147
需求分析 147
知识储备 147
1.list-style复合属性 147
2.背景图像定义列表项目符号 148
【任务5-3】 超链接标记 149
需求分析 149
知识储备 149
1.创建超链接 149
2.锚点链接 150
3.链接伪类控制超链接 152
【任务5-4】 布局及定义基础样式 154
准备工作 154
效果分析 155
定义基础样式 155
【任务5-5】 制作“头部”导航模块 156
效果分析 156
模块制作 156
【任务5-6】 制作“banner”和
“精品展示”模块 158
效果分析 158
模块制作 159
【任务5-7】 制作“潮流前沿”模块 162
效果分析 162
模块制作 162
【任务5-8】 制作“版权信息”模块 164
效果分析 164
模块制作 165
【项目总结】 166
【课后练习】 166
项目6 “千年之恋”注册页面制作 168
【项目描述】 169
【任务6-1】 认识表格相关标记 170
需求分析 170
知识储备 170
1.表格的创建 170
2.标记的属性 171
3.标记的属性 175
4.标记的属性 176
5.标记及其属性 177
【任务6-2】 CSS控制表格样式 178
需求分析 178
知识储备 178
1.CSS控制表格边框 178
2.CSS控制单元格边距 179
3.CSS控制单元格的宽高 181
【任务6-3】 认识表单 182
需求分析 182
知识储备 182
1.初识表单 182
2.创建表单 183
【任务6-4】 表单控件 184
需求分析 184
知识储备 184
1.input控件 184
2.textarea控件 188
3.select控件 189
【任务6-5】 CSS控制表单样式 192
需求分析 192
知识储备 192
CSS控制表单样式 192
【任务6-6】 布局及定义基础样式 194
准备工作 194
效果分析 195
定义基础样式 196
【任务6-7】 制作头部及导航模块 197
效果分析 197
模块制作 197
【任务6-8】 制作“banner”及“内容”
模块 199
效果分析 199
模块制作 200
【任务6-9】 制作“页脚”模块 204
效果分析 204
模块制作 204
【项目总结】 205
【课后练习】 205
项目7 “赶快回家网”首页制作 207
【项目描述】 208
【任务7-1】 JavaScript概述 209
需求分析 209
知识储备 209
1.JavaScript简介 209
2.JavaScript引入方式 210
3.JavaScript基本语法 212
4.一个简单的JavaScript程序 213
【任务7-2】 JavaScript语言基础 214
需求分析 214
知识储备 214
1.关键字和标识符 214
2.变量和数据类型 215
3.运算符和表达式 218
【任务7-3】 流程控制语句 224
需求分析 224
知识储备 224
1.条件语句 224
2.循环语句 229
3.跳转语句 232
【任务7-4】 函数 234
需求分析 234
知识储备 234
1.初识函数 234
2.函数的调用 235
3.函数中变量的作用域 235
【任务7-5】 布局及定义基础样式 236
准备工作 237
效果分析 237
定义基础样式 237
【任务7-6】 制作“头部”模块 239
效果分析 239
模块制作 240
【任务7-7】 制作“导航”模块 243
效果分析 243
模块制作 243
【任务7-8】 制作“banner”和“时间”
模块 245
效果分析 245
模块制作 246
【任务7-9】 制作“客运信息”模块 248
效果分析 248
模块制作 249
【任务7-10】 制作“底部”模块 252
效果分析 252
模块制作 252
【项目总结】 253
【课后练习】 253
项目8 “学好英语网”首页制作 255
【项目描述】 256
【任务8-1】 认识对象 257
需求分析 257
知识储备 257
1.什么是对象 257
2.对象的属性和方法 257
3.创建和删除对象 257
4.内置对象 259
【任务8-2】 Array数组对象 263
需求分析 263
知识储备 263
1.初识数组 263
2.数组的常见操作 264
3.数组的常用属性和方法 266
4.二维数组 268
【任务8-3】 BOM与DOM对象 269
需求分析 269
知识储备 269
1.BOM对象 269
2.DOM对象 275
【任务8-4】 事件处理 281
需求分析 281
知识储备 281
1.什么是事件 281
2.事件处理程序的调用 281
3.鼠标事件 283
4.键盘事件 284
5.表单事件 286
6.页面事件 287
【任务8-5】 布局及定义基础样式 289
准备工作 289
效果分析 289
定义基础样式 290
【任务8-6】 制作“头部”及“导航”
模块 292
效果分析 292
模块制作 292
【任务8-7】 制作“banner”模块 294
效果分析 294
模块制作 294
【任务8-8】 制作“简介”模块 297
效果分析 297
模块制作 298
【任务8-9】 制作“课程特色”模块 301
效果分析 301
模块制作 301
【任务8-10】 制作“页脚”模块 306
效果分析 306
模块制作 306
【项目总结】 307

【课后练习】 307






欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) 黑马程序员IT技术论坛 X3.2