网页设计与制作项目案例教程(第2版)

上篇 基础部分
项目1 网页设计与制作概述 1
1．1 任务目标 1
1．2 知识准备 2
1．2．1 网站和网页概述 2
1．2．2 网页设计素养 10
1．2．3 Web标准 12
1．2．4 HTML基础 13
1．2．5 网页设计常用软件 20
1．3 任务实施 20
任务1：实现大国工匠年度人物的图像信息展示 21
任务2：实现大国工匠年度人物的文字信息展示 24
1．4 任务总结 26
1．5 能力与知识拓展 26
1．6 巩固练习 30
项目2 HTML5页面元素及属性 32
2．1 任务目标 32
2．2 知识准备 32
2．2．1 结构元素 32
2．2．2 列表元素 36
2．2．3 分组元素 41
2．2．4 页面交互元素 42
2．3 任务实施 44
任务1：实现感动中国年度人物信息展示页面分区 45
任务2：实现感动中国年度人物的文字信息展示 46
2．4 任务总结 49
2．5 能力与知识拓展 50
2．6 巩固练习 50
项目3 CSS美化HTML网页 53
3．1 任务目标 53
3．2 知识准备 54
3．2．1 CSS概述 54
3．2．2 CSS语法与用法 55
3．2．3 CSS样式属性 57
3．2．4 基本选择器 61
3．2．5 复合选择器 64
3．2．6 CSS高级特性 68
3．3 任务实施 71
任务1：实现热点新闻网首页的信息展示 72
任务2：实现热点新闻网首页的样式设置 74
3．4 任务总结 76
3．5 能力与知识拓展 78
3．6 巩固练习 82
下篇 应用实践部分
项目4 网页div+CSS布局设计与制作 83
4．1 任务目标 83
4．2 知识准备 84
4．2．1 CSS盒子模型 84
4．2．2 盒子模型属性设置 85
4．2．3 div 90
4．2．4 浮动与定位 92
4．2．5 div+CSS实现网页布局 98
4．3 重庆愉快网学做菜首页页面设计与制作任务实施 103
任务1：创建重庆愉快网学做菜首页header部分 105
任务2：设置导航（nav）部分的CSS样式 110
任务3：设置文字部分的CSS样式 111
任务4：设置图文的CSS样式 113
4．4 任务总结 115
4．5 能力与知识拓展 115
4．6 巩固练习 116
项目5 网页表格布局设计与制作 118
5．1 任务目标 118
5．2 知识准备 119
5．2．1 表格标签 119
5．2．2 使用表格布局的原因 122
5．2．3 设计软件 123
5．3 个人网站相册页面设计与制作任务实施 123
任务1：创建个人网站相册页面站点 125
任务2：插入表格完成基本布局 131
任务3：编辑页面内容 134
5．4 任务总结 139
5．5 能力与知识拓展 139
5．5．1 网页常见结构布局 139
5．5．2 网页常见布局方法与原则 143
5．6 巩固练习 143
项目6 网页框架设计与制作 145
6．1 任务目标 145
6．2 知识准备 146
6．2．1 框架 146
6．2．2 ＜frameset＞标签与＜frame＞标签 146
6．2．3 ＜noframes＞标签 148
6．2．4 ＜iframe＞标签 149
6．3 重庆愉快网个人主页页面设计与制作任务实施 149
任务1：创建重庆愉快网个人主页页面 152
任务2：设计与制作top页面 156
任务3：设计与制作left页面 159
任务4：设计制作main页面 164
6．4 任务总结 168
6．5 能力与知识拓展 170
6．5．1 重庆愉快网找优惠页面中浮动框架的设计与制作 170
6．5．2 重庆愉快网找优惠框架链接的设计与制作 172
6．6 巩固练习 175
项目7 网页模板设计与制作 177
7．1 任务目标 177
7．2 知识准备 178
7．2．1 资源 179
7．2．2 库 179
7．2．3 库项目 180
7．2．4 编辑库项目 182
7．3 重庆愉快网内容页面设计与制作任务实施 183
任务1：分析、设计与制作内容页面的布局 184
任务2：设计与制作网页可编辑区域 189
任务3：通过模板页来设计与制作同类型的内容页面 192
7．4 任务总结 196
7．5 能力与知识拓展 198
7．6 巩固练习 200
项目8 网页表单设计与制作 202
8．1 任务目标 202
8．2 知识准备 203
8．2．1 表单标签 203
8．2．2 表单域 204
8．2．3 表单按钮 207
8．3 重庆愉快网注册表单页面设计与制作任务实施 208
任务1：创建重庆愉快网注册表单页面站点 210
任务2：创建重庆愉快网注册表单页面 210
任务3：注册表单页面的设计与制作 212
任务4：美化注册表单页面 219
8．4 任务总结 220
8．5 能力与知识拓展 223
8．5．1 表单页面制作原则 223
8．5．2 下拉列表的设计与制作 224
8．6 巩固练习 225
项目9 网页简单特效设计与制作 227
9．1 任务目标 227
9．2 知识准备 228
9．2．1 行为 228
9．2．2 JavaScript 230
9．2．3 JavaScript事件 232
9．2．4 JavaScript对象 232
9．3 重庆市少年宫网站首页页面设计与制作任务实施 233
任务1：创建重庆市少年宫网站首页页面站点 236
任务2：创建重庆市少年宫网站首页页面 236
任务3：重庆市少年宫网站首页页面的设计与制作 238
9．4 任务总结 243
9．5 能力与知识拓展 245
9．6 巩固练习 246
项目10 网页多媒体设计与制作 248
10．1 任务目标 248
10．2 知识准备 249
10．2．1 HTML5多媒体的特性 249
10．2．2 视频和音频编解码器 249
10．2．3 多媒体的格式 250
10．2．4 支持视频或音频的浏览器 251
10．2．5 在网页中嵌入音频 251
10．2．6 在网页中嵌入视频 252
10．3 简单音乐播放器设计与制作任务实施 256
任务1：创建音乐播放器网页 257
任务2：实现音乐播放功能 260
10．4 任务总结 263
10．5 能力与知识拓展 263
10．6 巩固练习 266