项目1 网页制作入门 1
1.1 Web基本概念 1
1.1.1 网页和网站 1
1.1.2 浏览器 3
1.1.3 Web标准 4
1.1.4 URL地址 4
1.2 HTML和HTML5 5
1.2.1 HTML 5
1.2.2 HTML5 5
1.2.3 HTML5优势 6
1.3 Web前端开发工具 6
1.3.1 开发工具介绍 6
1.3.2 Visual Studio Code工具 7
1.4 案例:制作简单的HTML5页面 11
1.4.1 任务描述 11
1.4.2 实施步骤 12
1.5 HTML5页面基础 14
1.5.1 HTML5基本文档结构 14
1.5.2 HTML标记 15
1.5.3 属性 16
1.5.4 注释 17
项目小结 17
单元测试与项目实践 17
项目2 添加网页内容 19
2.1 标题和段落标记 19
2.1.1 标题标记 19
2.1.2 段落标记 21
2.1.3 换行和水平线标记 21
2.2 文本格式化标记和特殊字符 23
2.2.1 文本格式化标记 23
2.2.2 特殊字符 25
2.3 图像标记 26
2.3.1 网页中常用的图像格式 26
2.3.2 图像标记和属性 26
2.3.3 图像地址 27
2.4 超链接标记 29
2.4.1 超链接标记和属性 29
2.4.2 超链接分类 30
2.5 列表标记 31
2.5.1 无序列表 32
2.5.2 有序列表 32
2.5.3 定义列表 33
2.5.4 列表嵌套 35
2.6 案例:制作诗词网页 36
2.6.1 任务描述 36
2.6.2 实施步骤 37
项目小结 40
单元测试与项目实践 40
项目3 CSS基础 42
3.1 CSS简介 42
3.2 CSS的核心基础 43
3.2.1 CSS样式规则 43
3.2.2 CSS引入方式 43
3.3 CSS基础选择器 47
3.4 案例:制作“药王—孙思邈”网页 52
3.4.1 任务描述 52
3.4.2 实施步骤 52
3.5 CSS的优先级、继承与层叠 54
3.5.1 CSS的优先级 54
3.5.2 CSS的继承性 58
3.5.3 CSS的层叠 59
项目小结 59
单元测试与项目实践 60
项目4 设置文本字体样式 61
4.1 设置字体样式属性 61
4.2 设置文本外观属性 66
4.3 CSS3新增文本样式 74
4.3.1 设置文字阴影和模糊效果 74
4.3.2 使用服务器字体 76
4.4 案例:制作“预防电信诈骗”网页 78
4.4.1 任务描述 78
4.4.2 实施步骤 79
4.5 设置超链接样式 82
项目小结 84
单元测试与项目实践 84
项目5 盒子模型 86
5.1 认识盒子模型 86
5.2 盒子模型常用的属性 88
5.2.1 border属性 89
5.2.2 margin属性 91
5.2.3 padding属性 92
5.2.4 背景属性 93
5.3 行内元素、块元素和行内块元素 96
5.3.1 行内元素 96
5.3.2 块元素 96
5.3.3 行内块元素 97
5.3.4 元素的转换 97
5.4 CSS3新增盒子样式 98
5.4.1 圆角边框 98
5.4.2 盒子阴影 100
5.4.3 渐变背景 101
5.5 案例:利用盒子模型制作
“四有青年”网页 103
5.5.1 任务描述 103
5.5.2 实施步骤 104
5.6 表格元素 106
5.7 HTML5新增文档结构元素 107
项目小结 109
单元测试与项目实践 110
项目6 元素的浮动和定位 111
6.1 元素的浮动 111
6.1.1 设置浮动效果 112
6.1.2 清除浮动 114
6.2 元素的定位 118
6.2.1 相对定位(relative) 119
6.2.2 绝对定位(absolute) 120
6.2.3 固定定位(fixed) 122
6.2.4 z-index属性 124
6.3 案例:制作环保网页 124
6.3.1 任务描述 124
6.3.2 实施步骤 125
项目小结 132
单元测试与项目实践 132
项目7 多媒体元素 134
7.1 audio标记 134
7.2 video标记 136
7.3 source标记 137
7.4 案例:制作“西北之旅”网页 140
7.4.1 任务描述 140
7.4.2 实施步骤 141
项目小结 143
单元测试与项目实践 143
项目8 表单的应用 145
8.1 form表单元素 145
8.2 input控件 146
8.3 select控件 148
8.4 其他常用控件 149
8.4.1 label控件 149
8.4.2 多行文本控件 151
8.4.3 button控件 151
8.5 HTML5新增的表单控件和属性 152
8.5.1 HTML5新增控件 152
8.5.2 HTML5新增input类型 154
8.5.3 HTML5新增表单属性 159
8.6 案例:制作“用户注册表”网页 165
8.6.1 任务描述 165
8.6.2 实施步骤 165
项目小结 170
单元测试与项目实践 170
项目9 CSS高级选择器 172
9.1 属性选择器 172
9.2 关系选择器 174
9.2.1 后代选择器 174
9.2.2 子代选择器 175
9.2.3 兄弟选择器 176
9.3 伪类选择器 177
9.4 伪对象选择器 179
9.5 案例:制作“电视剧介绍”网页 180
9.5.1 任务描述 180
9.5.2 实施步骤 181
项目小结 184
单元测试与项目实践 185
项目10 CSS3过渡、变形和动画效果 186
10.1 CSS3变形 186
10.1.1 设置变形 186
10.1.2 更改变形原点 189
10.2 CSS3过渡 191
10.3 CSS3动画 193
10.3.1 @keyframes规则 194
10.3.2 animation属性 194
10.4 案例:制作“河南文化旅游网”
?首页介绍栏目 197
10.4.1 任务描述 197
10.4.2 实施步骤 198
项目小结 203
单元测试与项目实践 204
项目11 综合实例 206
11.1 案例分析 206
11.2 网页布局规划 208
11.3 制作头部内容网页 209
11.4 制作内容栏目网页 212
11.4.1 制作banner图部分网页 212
11.4.2 制作主题内容“走进河南”网页 213
11.4.3 制作主题内容“河南美食”部分网页 217
11.5 制作底部内容网页 219
项目小结 222
参考文献 223