任务1 创建第一个网页 1
1.1 基本条件和概念 3
1.1.1 学习工具 3
1.1.2 基本概念 3
1.1.3 任务:建站点建网页 6
1.2 格式排版标签 9
1.2.1 段落标签与换行标签 9
1.2.2 标题标签 10
1.2.3 水平线标签 10
1.2.4 无语义标签 11
1.2.5 文本标签 11
1.3 列表标签 13
1.3.1 有序列表 14
1.3.2 无序列表 15
1.3.3 自定义列表 17
1.3.4 嵌套列表 18
1.4 图像 20
1.5 超链接 24
1.5.1 超链接的属性 24
1.5.2 邮箱链接 26
1.5.3 锚点链接 27
1.6 表格 28
1.7 任务实施 32
任务2 用CSS美化你的网页 36
2.1 CSS概念 37
2.2 CSS的使用方法 37
2.3 CSS声明与应用 39
2.3.1 CSS格式 39
2.3.2 CSS注释 39
2.3.3 CSS单位 39
2.3.4 CSS颜色 39
2.3.5 选择器 40
2.4 CSS常见属性 48
2.4.1 CSS字体 48
2.4.2 CSS文本 56
2.4.3 CSS盒子模型 66
2.4.4 CSS边框 72
2.4.5 CSS链接 81
2.4.6 CSS列表 83
2.4.7 CSS背景 92
2.4.8 CSS浮动 112
2.4.9 CSS定位 124
2.5 任务实施 129
任务3 规整网页布局 134
3.1 布局方式 135
3.2 固定布局 136
3.3 单列布局 136
3.3.1 等宽单列布局 136
3.3.2 非等宽单列布局 139
3.4 两列布局 141
3.4.1 浮动方式实现两列布局 141
3.4.2 position实现两列布局 142
3.5 三列布局 143
3.5.1 圣杯布局 143
3.5.2 双飞翼布局 147
3.6 嵌套混合布局 149
3.7 任务实施 150
3.7.1 整体布局 151
3.7.2 第二层布局 153
3.7.3 第三层布局 154
3.7.4 各模块内容设计 155
任务4 通过表单与用户交互 164
4.1 认识表单 165
4.1.1 表单域 166
4.1.2 表单元素 168
4.1.3 HTML5新增表单类型与属性 172
4.1.4 表单验证 177
4.2 任务实施 179
任务5 应用媒体标签制作个性化播放器 189
5.1 HTML5音频标签 190
5.2 HTML5视频标签 192
5.3 HTML5音视频标签使用中的“坑” 193
5.4 音视频标签的DOM操作 194
5.5 任务实施 198
任务6 制作活动抽奖大转盘 206
6.1 CSS坐标系统与角度单位 207
6.2 transform属性 209
6.3 transition属性 223
6.4 animation属性 228
6.5 @keyframes属性 230
6.6 任务实施 233
任务7 纯CSS实现瀑布流布局 240
7.1 多列布局实现瀑布流网页布局 241
7.1.1 多列布局知识图谱 241
7.1.2 多列布局前导知识 241
7.1.3 任务实施 245
7.2 弹性布局实现瀑布流布局 249
7.2.1 弹性布局知识图谱 249
7.2.2 弹性布局前导知识 250
7.2.3 容器属性 251
7.2.4 项目属性 254
7.2.5 利用弹性布局设计微信底部导航栏 257
7.2.6 任务实施 264
7.3 网格布局实现瀑布流布局 265
7.3.1 网格布局知识图谱 265
7.3.2 网格布局前导知识 266
7.3.3 任务实施 277
任务8 响应式网页开发 280
8.1 前导知识 281
8.1.1 设备屏幕 281
8.1.2 关于视口 284
8.1.3 媒体查询技术 287
8.1.4 响应式图片技术 290
8.1.5 流式布局 293
8.2 响应式框架制作旅游网页 299
8.2.1 安装Bootstrap 300
8.2.2 组件 302
8.2.3 布局 308
展开