单元1网页美化与布局的基本属性设置体验与分析 1
【知识预览】 1
【验证训练】 8
【任务1-1】验证美化与布局网页的基本属性设置 8
【任务描述】 8
【任务实施】 8
【引导训练】 17
【任务1-2】浏览网页0102.html的外观效果并分析其布局结构 17
【任务描述】 17
【任务实施】 17
【任务1-3】浏览网页0103.html的外观效果并分析其布局结构 18
【任务描述】 18
【任务实施】 18
【任务1-4】浏览网页0104.html的外观效果并分析其布局结构 19
【任务描述】 19
【任务实施】 19
【任务1-5】浏览网页0105.html的外观效果并分析其布局结构 20
【任务描述】 20
【任务实施】 20
【技术点睛】 21
【同步训练】 29
【任务1-6】浏览网页0106.html的外观效果并分析其布局结构 29
【任务描述】 29
【任务1-7】浏览网页0107.html的外观效果并分析其布局结构 30
【任务描述】 30
【任务1-8】浏览网页0108.html的外观效果并分析其布局结构 30
【任务描述】 30
【单元小结】 31
单元2网页文本与段落的美化与布局 32
【知识预览】 32
【验证训练】 42
【任务2-1】验证各种类型的文本属性设置 42
【任务描述】 42
【任务实施】 43
【引导训练】 44
【任务2-2】创建以正文文字为主体的网页0202.html 44
【任务描述】 44
【任务实施】 44
【任务2-3】创建包含文本标题和多个文本段落的网页0203.html 46
【任务描述】 46
【任务实施】 46
【任务2-4】创建包含导航文字和标题文字的网页0204.html 48
【任务描述】 48
【任务实施】 49
【任务2-5】创建布局结构较复杂的文本网页0205.html 51
【任务描述】 51
【任务实施】 51
【技术点睛】 54
【同步训练】 59
【任务2-6】创建包含正文内容和版权信息的网页0206.html 59
【任务描述】 59
【操作提示】 59
【任务2-7】创建包含导航文字和标题文字的网页0207.html 60
【任务描述】 60
【操作提示】 60
【单元小结】 61
单元3网页图片与背景的美化与布局 62
【知识预览】 62
【验证训练】 67
【任务3-1】验证各种类型的图片与背景属性设置 67
【任务描述】 67
【任务实施】 68
【引导训练】 68
【任务3-2】创建以图片为主体的网页0302.html 68
【任务描述】 68
【任务实施】 69
【任务3-3】创建多张图片并行排列的网页0303.html 70
【任务描述】 70
【任务实施】 70
【任务3-4】创建图片和文字的网页0304.html 71
【任务描述】 71
【任务实施】 71
【任务3-5】创建带动画效果的相册网页0305.html 74
【任务描述】 74
【任务实施】 74
【任务3-6】创建布局结构较复杂的图片墙网页0306.html 78
【任务描述】 78
【任务实施】 79
【技术点睛】 82
【同步训练】 90
【任务3-7】创建多列图片展示的网页0307.html 90
【任务描述】 90
【操作提示】 90
【任务3-8】创建图文混排的网页0308.html 92
【任务描述】 92
【操作提示】 92
【单元小结】 93
单元4 网页列表与表格的美化与布局 94
【知识预览】 94
【验证训练】 99
【任务4-1验证各种类型的列表属性设置 99
【任务描述】 99
【任务实施】 100
【任务4-2】验证各种类型的表格属性设置 101
【任务描述】 101
【任务实施】 101
【引导训练】 102
【任务4-3】创建以项目列表为主的标题新闻网页0403.html 102
【任务描述】 102
【任务实施】 102
【任务4-4】创建项目列表式导航按钮的网页0404.html 104
【任务描述】 104
【任务实施】 105
【任务4-5】创建应用项目列表模拟表格外观的网页0405.html 107
【任务描述】 107
【任务实施】 107
【任务4-6】创建应用表格存放数据的网页0406.html 112
【任务描述】 112
【任务实施】 112
【任务4-7】创建包含个性化表格的网页0407.html 114
【任务描述】 114
【任务实施】 114
【技术点睛】 116
【同步训练】 119
【任务4-8】创建以项目列表为主的旅游攻略标题网页0408.html 119
【任务描述】 119
【操作提示】 120
【任务4-9】创建以项目列表方式排列图片的网页0409.html 121
【任务描述】 121
【操作提示】 121
【任务4-10】创建通过项目列表实现的三列式布局网页0410.html 122
【任务描述】 122
【操作提示】 122
【任务4-11】创建以表格为主的网页0411.html 124
【任务描述】 124
【操作提示】 124
【单元小结】 126
单元5网页超链接与导航栏的美化与布局 127
【知识预览】 127
【验证训练】 130
【任务5-1】验证各种类型的超链接属性设置 130
【任务描述】 130
【任务实施】 131
【引导训练】 132
【任务5-2】创建包含横向主导航栏的网页0502.html 132
【任务描述】 132
【任务实施】 133
【任务5-3】创建包含横向主导航栏和锚链接的网页0503.html 137
【任务描述】 137
【任务实施】 137
【任务5-4】创建包含纵向栏目导航栏和横向主导航栏的网页0504.html 141
【任务描述】 141
【任务实施】 141
【任务5-5】创建包含图像热点链接的网页0505.html 144
【任务描述】 144
【任务实施】 144
【技术点睛】 149
【同步训练】 153
【任务5-6】创建包含顶部横向导航栏的网页0506.html 153
【任务描述】 153
【操作提示】 154
【任务5-7】创建包含锚链接和导航按钮的网页0507.html 155
【任务描述】 155
【操作提示】 156
【任务5-8】创建包含多个矩形图像链接的网页0508.html 160
【任务描述】 160
【操作提示】 160
【单元小结】 161
单元6网页表单元素与表单的美化与布局 162
【知识预览】 162
【验证训练】 166
【任务6-1】验证表单及表单控件各种类型的属性设置 166
【任务描述】 166
【任务实施】 167
【引导训练】 169
【任务6-2】创建酒店预订的表单网页0602.html 169
【任务描述】 169
【任务实施】 170
【任务6-3】创建酒店搜索的表单网页0603.html 178
【任务描述】 178
【任务实施】 179
【任务6-4】创建用户注册的表单网页0604.html 182
【任务描述】 182
【任务实施】 182
【技术点睛】 186
【同步训练】 188
【任务6-5】创建旅游线路搜索的表单网页0605.html 188
【任务描述】 188
【操作提示】 188
【任务6-6】创建用户登录的表单网页0606.html 190
【任务描述】 190
【操作提示】 191
【单元小结】 193
单元7网页特效的美化与布局 194
【知识预览】 194
【验证训练】 199
【任务7-1】验证图片切换特效的属性设置 199
【任务描述】 199
【任务实施】 200
【引导训练】 201
【任务7-2】创建包含特效文字的网页0702.html 201
【任务描述】 201
【任务实施】 201
【任务7-3】创建包含板块着色特效的网页0703.html 203
【任务描述】 203
【任务实施】 203
【任务7-4】创建包含图片及特形相框特效的网页0704.html 205
【任务描述】 205
【任务实施】 205
【任务7-5】创建包含横向图片滚动特效的网页0705.html 207
【任务描述】 207
【任务实施】 207
【任务7-6】创建包含横向图片循环轮换特效的网页0706.html 211
【任务描述】 211
【任务实施】 212
【任务7-7】创建包含纵向图片循环轮换特效的网页0707.html 216
【任务描述】 216
【任务实施】 217
【技术点睛】 222
【同步训练】 226
【任务7-8】创建选项卡式切换文本内容的网页0708.html 226
【任务描述】 226
【操作提示】 227
【任务7-9】创建单张图片轮换特效的网页0709.html 229
【任务描述】 229
【操作提示】 229
【单元小结】 232
单元8网页整体的美化与布局 233
【知识预览】 233
【验证训练】 246
【任务8-1】验证网页的不同布局方式 246
【任务描述】 246
【任务实施】 246
【引导训练】 248
【任务8-2】创建浮动定位两列式布局的网页0802.html 248
【任务描述】 248
【任务实施】 249
【任务8-3】创建绝对定位两列式布局网页0803.html 251
【任务描述】 251
【任务实施】 251
【任务8-4】创建左宽右窄的两列式布局网页0804.html 253
【任务描述】 253
【任务实施】 253
【任务8-5】创建左窄右宽的两列式布局网页0805.html 256
【任务描述】 256
【任务实施】 256
【任务8-6】创建等距排列的四列式布局网页0806.html 258
【任务描述】 258
【任务实施】 259
【任务8-7】创建不规则布局网页0807.html 262
【任务描述】 262
【任务实施】 262
【技术点睛】 266
【同步训练】 283
【任务8-8】创建浮动定位两列规则分块的网页0808.html 283
【任务描述】 283
【操作提示】 283
【任务8-9】创建三列式与四列式等距布局的网页0809.html 286
【任务描述】 286
【操作提示】 286
【单元小结】 288
附录A HTML5增减的标签与属性 289
附录B HTML5的常用标签及其属性 293
附录C CSS的属性 297
附录D CSS的选择器 303
附录E网页美化与布局课程设计 313
参考文献 316