HTML5培训

HUAWEITECHNOLOGIESCO.,LTD.英文标题:40-47pt副标题:26-30pt字体颜色:反白内部使用字体:FrutigerNextLTMedium外部使用字体:Arial中文标题:35-47pt字体:黑体副标题:24-28pt字体颜色:反白字体:细黑体2019/9/15HTML5基础培训HUAWEITECHNOLOGIESCO.,LTD.HuaweiConfidential英文标题:32-35pt颜色:R153G0B0内部使用字体:FrutigerNextLTMedium外部使用字体:Arial中文标题:30-32pt颜色:R153G0B0字体:黑体英文正文:20-22pt子目录(2-5级):18pt颜色:黑色内部使用字体:FrutigerNextLTRegular外部使用字体:Arial中文正文:18-20pt子目录(2-5级):18pt颜色:黑色字体:细黑体配色参考方案：建议同一页面内不超过四种颜色，以下是13组配色方案，同一页面内只选择一组使用。（仅供参考）客户或者合作伙伴的标志放在右上角.目录一什么是HTML5二HTML5新特性和那些效果三HTML5目前存在的应用局限四开放讨论：HTML5适合应用于我们哪些项目？Page2英文目录标题:35-40pt颜色:R153G0B0内部使用字体:FrutigerNextLTMedium外部使用字体:Arial中文目录标题:35-40pt颜色:R153G0B0字体:黑体英文目录正文:28-30pt子目录(2-5级):20-30pt颜色:黑色内部使用字体:FrutigerNextLTRegular外部使用字体:Arial中文目录正文:28-30pt子目录(2-5级):20-30pt颜色:黑色字体:细黑体一什么是HTML5Page3HUAWEITECHNOLOGIESCO.,LTD.HuaweiConfidential英文标题:32-35pt颜色:R153G0B0内部使用字体:FrutigerNextLTMedium外部使用字体:Arial中文标题:30-32pt颜色:R153G0B0字体:黑体英文正文:20-22pt子目录(2-5级):18pt颜色:黑色内部使用字体:FrutigerNextLTRegular外部使用字体:Arial中文正文:18-20pt子目录(2-5级):18pt颜色:黑色字体:细黑体配色参考方案：建议同一页面内不超过四种颜色，以下是13组配色方案，同一页面内只选择一组使用。（仅供参考）客户或者合作伙伴的标志放在右上角.1HTML历史Page4今天1991年1994年1997年1995年2009年HUAWEITECHNOLOGIESCO.,LTD.HuaweiConfidential英文标题:32-35pt颜色:R153G0B0内部使用字体:FrutigerNextLTMedium外部使用字体:Arial中文标题:30-32pt颜色:R153G0B0字体:黑体英文正文:20-22pt子目录(2-5级):18pt颜色:黑色内部使用字体:FrutigerNextLTRegular外部使用字体:Arial中文正文:18-20pt子目录(2-5级):18pt颜色:黑色字体:细黑体配色参考方案：建议同一页面内不超过四种颜色，以下是13组配色方案，同一页面内只选择一组使用。（仅供参考）客户或者合作伙伴的标志放在右上角.2什么是HTML5官方概念：HTML5草案的前身名为WebApplications1.0，是HTML4的更新加强版本。它增加了新的标签和属性，强化了网页的标准、语义化、图像表达能力和交互效果。广义概念：HTML5代表浏览器端技术的一个发展阶段。在这个阶段，浏览器呈现技术得到了一个飞跃发展和广泛支持，这些技术包括：HTML5，DOM3，CSS3，JSAPI，SVG，WebGL（3D）等后面我们描述的HTML5就是基于广义来讲述Page5英文目录标题:35-40pt颜色:R153G0B0内部使用字体:FrutigerNextLTMedium外部使用字体:Arial中文目录标题:35-40pt颜色:R153G0B0字体:黑体英文目录正文:28-30pt子目录(2-5级):20-30pt颜色:黑色内部使用字体:FrutigerNextLTRegular外部使用字体:Arial中文目录正文:28-30pt子目录(2-5级):20-30pt颜色:黑色字体:细黑体二HTML5新特性和应用Page6HUAWEITECHNOLOGIESCO.,LTD.HuaweiConfidential英文标题:32-35pt颜色:R153G0B0内部使用字体:FrutigerNextLTMedium外部使用字体:Arial中文标题:30-32pt颜色:R153G0B0字体:黑体英文正文:20-22pt子目录(2-5级):18pt颜色:黑色内部使用字体:FrutigerNextLTRegular外部使用字体:Arial中文正文:18-20pt子目录(2-5级):18pt颜色:黑色字体:细黑体配色参考方案：建议同一页面内不超过四种颜色，以下是13组配色方案，同一页面内只选择一组使用。（仅供参考）客户或者合作伙伴的标志放在右上角.HTML5新特性（顺序待调整）媒体支持：Video和Audio画布元素-Canvas以及WebGL视频加速增强的表单Form更炫的平面动画-CSS3页面渲染及CSS33D矢量支持-SVGHTML5的图形机制比较-SVGvsCanvas离线应用原生的拖拽其他HTML5特性..Page7英文目录标题:35-40pt颜色:R153G0B0内部使用字体:FrutigerNextLTMedium外部使用字体:Arial中文目录标题:35-40pt颜色:R153G0B0字体:黑体英文目录正文:28-30pt子目录(2-5级):20-30pt颜色:黑色内部使用字体:FrutigerNextLTRegular外部使用字体:Arial中文目录正文:28-30pt子目录(2-5级):20-30pt颜色:黑色字体:细黑体媒体支持VIDEO/AUDIO/WEBRTCPage8HUAWEITECHNOLOGIESCO.,LTD.HuaweiConfidential英文标题:32-35pt颜色:R153G0B0内部使用字体:FrutigerNextLTMedium外部使用字体:Arial中文标题:30-32pt颜色:R153G0B0字体:黑体英文正文:20-22pt子目录(2-5级):18pt颜色:黑色内部使用字体:FrutigerNextLTRegular外部使用字体:Arial中文正文:18-20pt子目录(2-5级):18pt颜色:黑色字体:细黑体配色参考方案：建议同一页面内不超过四种颜色，以下是13组配色方案，同一页面内只选择一组使用。（仅供参考）客户或者合作伙伴的标志放在右上角.当前应用场景Page9视频点播直播-优酷HTML5版本视频聊天-Googlehtml5视频聊天功能HUAWEITECHNOLOGIESCO.,LTD.HuaweiConfidential英文标题:32-35pt颜色:R153G0B0内部使用字体:FrutigerNextLTMedium外部使用字体:Arial中文标题:30-32pt颜色:R153G0B0字体:黑体英文正文:20-22pt子目录(2-5级):18pt颜色:黑色内部使用字体:FrutigerNextLTRegular外部使用字体:Arial中文正文:18-20pt子目录(2-5级):18pt颜色:黑色字体:细黑体配色参考方案：建议同一页面内不超过四种颜色，以下是13组配色方案，同一页面内只选择一组使用。（仅供参考）客户或者合作伙伴的标志放在右上角.AudioVideo&WebRTCvideo标签定义视频，比如电影片段或其他视频流。audio标签定义声音，比如音乐或其他音频流。WebRTC（WebReal-TimeCommunication）是应用在视频会议、实时广播、多方会谈、点对点应用程序等等的新的协议与API（用navigator.getUserMedia启动用户计算机的摄影机，用PeerConnection进行点对点传输等等）Page10HUAWEITECHNOLOGIESCO.,LTD.HuaweiConfidential英文标题:32-35pt颜色:R153G0B0内部使用字体:FrutigerNextLTMedium外部使用字体:Arial中文标题:30-32pt颜色:R153G0B0字体:黑体英文正文:20-22pt子目录(2-5级):18pt颜色:黑色内部使用字体:FrutigerNextLTRegular外部使用字体:Arial中文正文:18-20pt子目录(2-5级):18pt颜色:黑色字体:细黑体配色参考方案：建议同一页面内不超过四种颜色，以下是13组配色方案，同一页面内只选择一组使用。（仅供参考）客户或者合作伙伴的标志放在右上角.演示：Page11播放视频创建声音Audio播放声音英文目录标题:35-40pt颜色:R153G0B0内部使用字体:FrutigerNextLTMedium外部使用字体:Arial中文目录标题:35-40pt颜色:R153G0B0字体:黑体英文目录正文:28-30pt子目录(2-5级):20-30pt颜色:黑色内部使用字体:FrutigerNextLTRegular外部使用字体:Arial中文目录正文:28-30pt子目录(2-5级):20-30pt颜色:黑色字体:细黑体画布元素-CANVAS以及WEBGL视频加速Page12HUAWEITECHNOLOGIESCO.,LTD.HuaweiConfidential英文标题:32-35pt颜色:R153G0B0内部使用字体:FrutigerNextLTMedium外部使用字体:Arial中文标题:30-32pt颜色:R153G0B0字体:黑体英文正文:20-22pt子目录(2-5级):18pt颜色:黑色内部使用字体:FrutigerNextLTRegular外部使用字体:Arial中文正文:18-20pt子目录(2-5级):18pt颜色:黑色字体:细黑体配色参考方案：建议同一页面内不超过四种颜色，以下是13组配色方案，同一页面内只选择一组使用。（仅供参考）客户或者合作伙伴的标志放在右上角.应用场景流程图-我司某运营产品构建3D虚拟拓扑图-某3D网管HUAWEITECHNOLOGIESCO.,LTD.HuaweiConfidential英文标题:32-35pt颜色:R153G0B0内部使用字体:FrutigerNextLTMedium外部使用字体:Arial中文标题:30-32pt颜色:R153G0B0字体:黑体英文正文:20-22pt子目录(2-5级):18pt颜色:黑色内部使用字体:FrutigerNextLTRegular外部使用字体:Arial中文正文:18-20pt子目录(2-5级):18pt颜色:黑色字体:细黑体配色参考方案：建议同一页面内不超过四种颜色，以下是13组配色方案，同一页面内只选择一组使用。（仅供参考）客户或者合作伙伴的标志放在右上角.CanvasAPIcanvas，HTML5最期待元素之一，可以通过脚本可以任意创建图形，编辑图形，导入图片，导出图片。其中分2D与3D：2DcontextAPI：基本线条、路径、插入图像、像素级操作、文字、阴影、颜色渐变等提供图形绘制功能。3DcontextAPI（WebGL）：WebGl定义了一套API,能够允许在网页中使用类似于OpenGL，实际上是一套基于OpenGLES2.0的