整合营销服务商
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
随着移动互联网学习的常态化，许多企业陆续上线了各自的移动学习平台。平台的上线必然会产生对移动学习课件的大量需求。此时，什么样的课件形式比较适合移动学习平台？这些不同形式的课件又该如何开发制作？这些都成为开发制作移动学习课件需要考虑的问题。
在此过程中，基于Web和浏览器，依托HTML5技术所制作出来的课件（下简称HTML5课件）因其在课件稳定性、形式表现多样性、良好的交互性以及支持跨平台学习等各方面的天然优势，日益成为备受企业青睐的一种课件形式。
>>>为什么是HTML5课件？
不少课件制作开发人员可能都曾使用过传统网页技术来制作E-learning课件，特别是要快速开发制作出一些E-learning课程时，网页浏览课件方式常常成为快捷之选。因为制作网页的技能并不困难，对于会使用WORD的人而言，只要再加上一些编辑工具或网页范例即可以套用。就连企业内人员也可自行编写，有助于建成企业员工自学的浏览式教材库。
但是，由于传统网页技术本身的局限，此类课件通常通篇下来就是文字和一些图片，由于缺乏声影的配合，更无法引入一些交互参与的教学设计，使得学员注意力难以集中，学习效果也不尽如人意。因此，在实际运用中，此类课件通常只是被用于制作诸如介绍企业专业新知识、产业环境、新产品特性等更新迅速的信息、资讯类资料。
而基于HTML5技术开发制作的网页课件颠覆了这一切。相较于传统网页技术，HTML5所带来的改变和规范体现在网页技术的方方面面，比如：描述性更强的新标签，增强多媒体支持，更强大的前端Web API接口，完善的本地存储机制，配合CSS3的更精美的界面设计，可访问性的提升……
那上述这些技术上的变化对移动学习网页课件的开发与制作意味着什么呢？这些变化意味着：如果我们使用HTML5技术来开发制作移动学习课件，课件将具备以下特点：
1、HTML5课件能将各种课件形式融合起来，实现文字、图片、表格、音频、视频、交互、色彩、创意的有机结合。
这种有机结合之所以能够实现正是因为HTML5支持视频、音频等多媒体元素，CSS3支持字体嵌入、版面排版，以及最令人印象深刻的动画功能等。这些强大的技术支持使得HTML5网页课件彻底告别了传统网页课件缺乏声影、形式单一等各种不足。
在一个典型的HTML5网页课件中，我们可以有文本、图片，还可以有视频和交互。显然，HTML5网页课件使得学习内容的表现形式变得更加丰富，能极大的提升学员学习兴趣，增强学习效果。
2、HTML5课件能实现良好的学习交互。
相较于传统网页技术，HTML5在用户的可用性和友好体验上带来非常大的改进。在开发设计网页课件时，教学设计人员可充分发挥出这一技术优势，结合内容特点，设计一些学习交互点，提升学员的学习参与度。
3、HTML5课件能支持跨平台学习，有助于在不同学习终端获得一致的良好学习体验。
HTML5的优势目前主要是体现在终端上，尤其是跨平台、跨分辨率、终端自适应等方面。可以说，相较于传统HTML技术，它的很多新特性，都是针对终端设备，为的就是在终端设备上有更好的体验和交互。
显然，在这一点上，HTML5课件特点与移动学习需求可谓有着天然的契合。因为在移动互联网时代，用户的终端设备是各式各样的，同一个用户也可能拥有多个不同的终端设备，课件只有支持跨平台学习并能实现终端自适应才能保证学员获得良好一致的学习体验。
在我们对HTML5课件所具备的特点及优势有了一定了解后，也就不难理解为什么许多企业在开发制作移动学习课程时对HTML5课件形式青眼相加。与此同时，如何开发制作出一个优秀的HTML5课件也就成为一个新的挑战。
HTML5+CSS3 Web前端开发与实例教程：微课视频版》
本书内容
《HTML5+CSS3 Web前端开发与实例教程：微课视频版》秉承“思政引领，立德树人”的教育理念，自然融入多维度、深层次的思政元素，全面对标企业和行业需求；引入现代Web前端开发的核心技术，如Flex布局、Grid布局，以及人工智能编程插件，同时融入企业开发实践，确保学习内容与实际工作紧密相关。全书以一个完整案例为主线，结合综合项目实战操作，体现育人、应用和创新三项能力。《HTML5+CSS3 Web前端开发与实例教程：微课视频版》配套提供课程思政元素、案例源代码、PPT课件、课后习题与答案、微课视频、教案、教学大纲、章节测试、云题库、实验报告、学习通在线课程、企业高频面试题、学科竞赛真题等丰富的教学资源，并设有QQ群提供线上学习跟踪和指导服务。
《HTML5+CSS3 Web前端开发与实例教程：微课视频版》共分14章，系统地讲解Web前端开发的核心技术，主要内容包括Web前端开发概述、HTML5基础、HTML5页面元素和属性、表单、CSS3基础、CSS3修饰页面元素、CSS3高级选择器、CSS3盒子模型、浮动与定位、CSS3高级应用、网页布局、Flex布局、Grid布局等，并提供“大学生参军入伍专题网站”和“文创商城”两个实战案例。
本书作者
卢欣欣，副教授。长期从事高校教学工作，专注Web应用开发，项目开发经验丰富。主讲《Web程序设计》《高级程序设计》《软件开发综合实践》等课程，先后主编教材2部，参编教材3部。在慕课网上线的《企业网站综合布局实战》课程学习人数超15万人。
崔仲远，副教授，毕业于北京交通大学。长期从事高校教学工作和软件项目开发工作，实战开发经验丰富。先后承担《网页特效设计》《Web前端基础》《跨平台脚本开发技术》等多门课程的教学任务，发表学术论文多篇，主编教材2部，参编教材3部、专著1部。主持省级教改项目1项、科研项目1项。
本书读者
《HTML5+CSS3 Web前端开发与实例教程：微课视频版》既可作为本专科院校计算机相关专业的Web程序设计、网页设计与制作等课程的教材，也可作为Web应用开发人员的自学手册和技术参考书。
本书目录
第1章 Web前端开发概述 1
1.1 Web前端开发职责 1
1.2 Web前端开发相关概念 2
1.3 Web前端开发相关技术 3
1.3.1 Web标准 3
1.3.2 HTML 4
1.3.3 CSS 4
1.3.4 JavaScript 5
1.4 Web前端开发工具 5
1.4.1 代码编辑工具：VSCode 6
1.4.2 代码运行工具：浏览器 8
1.4.3 开发者工具 9
1.4.4 人工智能辅助编程工具 10
1.5 网站设计与开发流程 11
1.6 实战案例：网页显示“社会主义核心价值观” 12
1.7 本章小结 13
第2章 HTML5基础 14
2.1 HTML5语法基础 14
2.1.1 HTML文档结构 14
2.1.2 HTML标签语法 17
2.1.3 HTML注释 18
2.2 文本控制标签 19
2.2.1 标题标签 19
2.2.2 段落标签 20
2.2.3 换行标签 20
2.2.4 文本格式化标签 21
2.2.5 特殊字符 22
2.3 图像标签 23
2.3.1 网页常用图像格式 23
2.3.2 图像标签的使用 24
2.3.3 相对路径与绝对路径 26
2.4 超链接标签 27
2.4.1 文本链接 27
2.4.2 图像链接 28
2.4.3 书签（锚点）链接 28
2.4.4 其他链接 30
2.5 列表 30
2.5.1 有序列表 31
2.5.2 无序列表 32
2.5.3 定义列表 34
2.5.4 嵌套列表 35
2.6 表格 36
2.6.1 表格结构 36
2.6.2 表格标签 37
2.7 视频和音频标签 41
2.7.1 视频标签 41
2.7.2 音频标签 42
2.8 其他标签 42
2.8.1 预格式化标签 42
2.8.2 水平线标签 43
2.8.3 行内容器标签 43
2.9 实战案例：“大学生参军网站”兵役登记页面 44
2.10 本章小结 46
第3章 HTML5页面元素和属性 47
3.1 文档结构标签 47
3.1.1标签 47
3.1.2标签 49
3.1.3标签 50
3.1.4标签 51
3.1.5标签 53
3.1.6标签 53
3.1.7和标签 54
3.1.8标签 55
3.2 交互元素 55
3.2.1 标签 55
3.2.2 标签 56
3.2.3标签 57
3.3 文本层次语义标签 58
3.3.1 标签 58
3.3.2 标签 59
3.3.3 标签 60
3.4 全局属性 61
3.5 实战案例：“大学生参军网站”页面结构 62
3.6 本章小结 64
第4章 表单 65
4.1 表单概述 65
4.2标签 67
4.3 标签 68
4.3.1 单行文本框 69
4.3.2 密码框 69
4.3.3 文件域 70
4.3.4 单选按钮和复选框 71
4.3.5 隐藏域 73
4.3.6 按钮 73
4.3.7 HTML5新增输入元素 76
4.4 标签 78
4.5 标签 79
4.6 选择列表标签 80
4.7 多行文本框标签 83
4.8 表单常用属性 84
4.9 实战案例：“大学生参军网站”网上咨询表单 86
4.10 本章小结 88
第5章 CSS3基础 89
5.1 CSS概述 89
5.2 CSS语法规则 90
5.3 CSS样式的引入方法 91
5.3.1 行内样式表 91
5.3.2 内部样式表 92
5.3.3 外部样式表 93
5.4 CSS基本选择器 94
5.4.1 标签选择器 94
5.4.2 ID选择器 95
5.4.3 类选择器 95
5.4.4 通用选择器 97
5.5 实战案例：“大学生参军网站”公共样式表制作 97
5.6 本章小结 98
第6章 CSS3修饰页面元素 99
6.1 CSS字体样式 99
6.1.1 字体粗细属性 99
6.1.2 字体风格属性 100
6.1.3 字体大小属性 101
6.1.4 字体族属性 103
6.1.5 字体属性 106
6.2 CSS文本样式 107
6.2.1 行高属性 107
6.2.2 颜色属性 109
6.2.3 文本水平对齐属性 110
6.2.4 首行缩进属性 111
6.2.5 文本修饰属性 111
6.2.6 字符间距属性 112
6.2.7 字间距属性 113
6.2.8 字母大小写属性 114
6.2.9 文本阴影效果属性 115
6.3 CSS表格样式 116
6.4 CSS表单样式 118
6.4.1 单行文本框美化 119
6.4.2 按钮美化 120
6.4.3 下拉列表美化 120
6.5 CSS列表样式 122
6.6 实战案例：“大学生参军网站”在线咨询页面 123
6.7 本章小结 126
第7章 CSS3高级选择器 127
7.1 组合选择器 127
7.1.1 交集选择器 127
7.1.2 并集选择器 128
7.1.3 后代选择器 129
7.1.4 子元素选择器 130
7.1.5 相邻兄弟选择器 131
7.1.6 通用兄弟选择器 132
7.2 属性选择器 133
7.3 伪类选择器 134
7.4 伪元素选择器 136
7.5 CSS三大特性 138
7.6 本章小结 141
第8章 CSS3盒子模型 142
8.1 盒子模型概述 142
8.1.1 认识盒子模型 142
8.1.2
标签 144
8.2 盒子模型的相关属性 144
8.2.1 内容区域的宽度和高度 144
8.2.2 边框 145
8.2.3 内边距 152
8.2.4 外边距 153
8.3 阴影 155
8.4 box-sizing 156
8.5 背景属性 158
8.5.1 背景颜色 158
8.5.2 背景图像 158
8.5.3 图像平铺方式 158
8.5.4 背景图像位置 160
8.5.5 背景图像固定 161
8.5.6 背景图像大小 161
8.5.7 背景裁剪 163
8.5.8 背景复合属性 164
8.5.9 CSS精灵图 165
8.6 实战案例：“大学生参军网站”登录页面 166
8.7 本章小结 169
第9章 浮动与定位 170
9.1 标准文档流 170
9.2 元素的分类 171
9.2.1 块级元素、行内元素与行内块元素 171
9.2.2 元素的类型转换 172
9.3 元素的浮动 173
9.3.1 设置浮动 174
9.3.2 清除浮动 176
9.4 元素的定位 180
9.4.1 定位的概念 180
9.4.2 定位属性 181
9.4.3 静态定位 181
9.4.4 相对定位 182
9.4.5 绝对定位 183
9.4.6 固定定位 186
9.4.7 粘性定位 187
9.4.8 层叠等级属性 188
9.5 实战案例：“大学生参军网站”轮播图效果 190
9.6 本章小结 192
第10章 CSS3高级应用 193
10.1 变换 193
10.1.1 旋转 194
10.1.2 倾斜 195
10.1.3 缩放 196
10.1.4 平移 197
10.1.5 变换原点 198
10.2 过渡 200
10.3 动画 202
10.4 实战案例：“大学生参军网站”CSS3高级应用 205
10.5 本章小结 208
第11章 网页布局 209
11.1 网页布局概述 209
11.1.1 网页布局的概念 209
11.1.2 网页布局的流程 210
11.1.3 常见的网页布局方法 211
11.2 网页布局命名规范 211
11.3 常见布局的实现 212
11.3.1 单列布局 212
11.3.2 两列常规布局 214
11.3.3 三列常规布局 216
11.3.4 两列自适应等高布局 217
11.3.5 三列自适应布局 219
11.4 实战案例：“大学生参军网站”首页主体部分 223
11.5 本章小结 225
第12章 Flex布局 226
12.1 Flex布局概述 226
12.2 Flex布局相关概念 227
12.3 容器属性 227
12.3.1 display属性 228
12.3.2 flex-direction属性 228
12.3.3 flex-wrap属性 230
12.3.4 justify-content属性 232
12.3.5 align-items属性 233
12.3.6 align-content属性 235
12.4 项目属性 236
12.4.1 order属性 236
12.4.2 flex-grow属性 237
12.4.3 flex-shrink属性 239
12.4.4 flex-basis属性 240
12.4.5 flex属性 241
12.5 实战案例：“大学生参军网站”导航条 242
12.6 本章小结 244
第13章 Grid布局 245
13.1 Grid布局概述 245
13.2 Grid布局相关概念 246
13.3 容器属性 246
13.3.1 display属性 247
13.3.2 划分网格 248
13.3.3 行间隔和列间隔 252
13.3.4 项目对齐方式 253
13.4 项目属性 255
13.4.1 grid-column和grid-row属性 255
13.4.2 grid-area属性 257
13.5 实战案例：“大学生参军网站”视频展播列表 258
13.6 本章小结 260
第14章 Web前端项目综合实践——文创商城 261
14.1 项目概述 261
14.2 需求分析 262
14.3 原型设计 262
14.4 公共部分的设计与实现 265
14.4.1 重置样式 265
14.4.2 页面头部 265
14.4.3 页面底部 268
14.4.4 悬浮侧边栏 270
14.5 首页的设计与实现 271
14.5.1 甄选好物版块 271
14.5.2 国博文房版块 274
14.6 商品列表页的设计与实现 277
14.6.1 商品类型筛选 277
14.6.2 分页导航 278
14.7 商品详情页的设计与实现 279
14.8 本章小结 283
编辑推荐
1HTML5与CSS3是Web前端开发的两大核心技术，它们不仅是Web前端开发工程师必须掌握的技能，也是高校一门重要的Web前端课程内容
2《HTML5+CSS3 Web前端开发与实例教程：微课视频版》以“从项目中来到项目中去”为主旨，从Web前端开发的基本概念入手，系统介绍HTML5、CSS3网页编程技巧。
3《HTML5+CSS3 Web前端开发与实例教程：微课视频版》采取“知识点讲解+示例解析+案例详讲+高频面试题+实践操作+学科竞赛真题”的递进式教学模式，引导读者理解理论知识，掌握开发方法，学会复杂的网站设计技能，全面提升读者的Web前端开发能力。
4《HTML5+CSS3 Web前端开发与实例教程：微课视频版》配套资源非常丰富，包括思政元素、案例源代码、PPT课件、微课视频、习题与答案、教案、教学大纲、章节测试、云题库、实验报告、学习通在线课程，能帮助读者快速掌握HTML5与CSS3前端技术。
本文摘自《HTML5+CSS3 Web前端开发与实例教程：微课视频版》，获出版社和作者授权发布。
TML5课件
玩微信的朋友对HTML5都不陌生，它就像一个绝世大美女，一出场就受到了各方的强烈关注，自然也受到了移动学习平台（m-learning）的青睐。HTML5的资本在于它支持跨平台，在于它可以实现文字、图片、表格、音频、视频的有机结合，在于它良好的交互性。
支持跨平台学习
相对于传统的HTML技术，HTML5针对终端设备增加了许多新特性，只需一个版本即可实现跨平台、跨分辨率、终端自适应等。不需要再考虑是得用电脑还是手机，得用苹果还是安卓。不管什么设备，只需要一个支持HTML5的浏览器，统统搞定。
HTML5的这个特性对于移动学习来说无疑是个特大好消息，简直就是为了移动学习量身定做的。如此一来，HTML5课件可以跨平台，并实现终端自适应，既节省了培训课件开发者的时间，又能让学员获得良好一致的学习体验。
文字、图片、音频、视频等多种呈现方式
Web刚出现的时候，我们都在网上看些基础文档学习，随着互联网技术的发展，纯静态页面已经难以吸引用户的眼球，而HTML5课件的出现，让人眼前一亮，音频、视频等多媒体元素的支持，让学习内容变得更加丰富多彩，极大地提升了学员的学习兴趣，这在课件形式上也是一场质的飞跃。
良好的交互性
上学的时候，老师都比较喜欢积极发言的同学，因为互动。同样，在开发设计网页课件时，教学设计人员也希望可以与用户互动。HTML5的特性，正可以让教学设计人员设计一些学习交互点，提升学员的学习参与度。
正因为HTML5课件有如此多特性，使得企业在培训的微课形式上，更喜欢HTML5课件。思创拥有16年e-learning综合服务经验，为客户提供课程定制开发服务，课件形式包括：快速开发、图文类、综合动画、HTML5交互。
更多资讯关注微信公众号：思创云学习
*请认真填写需求信息，我们会在24小时内与您取得联系。
