HTML5介绍ppt.ppt

《HTML5介绍ppt.ppt》由会员分享，可在线阅读，更多相关《HTML5介绍ppt.ppt（21页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、HTML5介绍ppt什么是HTML5HTML5的特点HTML5的新特性简介+趋势优势&略势实例的演示2013年全球有10亿手机浏览器支持HTML5。HTML5将成为未来5-10年内，移动互联网领域的主宰者。许多游戏开发商都被Facebook或者Zynga推动着发展，而未来的Facebook应用生态系统是基于HTML5的.游戏开发者引领从如今移动应用层出不穷，在这个智能手机和将平板电脑大爆炸的时代，移动优先已成趋势，不管是开发什么，都以移动为主。.移动优先发展趋势HTML5将成为主流什么是HTML5HTML5的特点HTML5的新特性简介+趋势优势&略势实例的演示什么是HTML5HTML5的特点H

2、TML5的新特性简介+趋势优势&略势实例的演示跨平台性非常强大，可以轻易的移植，这也是大多数人对HTML5有兴趣的主要原因。多设备跨平台游戏客户端每次都要更新，很麻烦。可是更新HTML5游戏就好像更新页面一样，是马上的、即时的更新。即时更新“一次设计，普遍适用”，让同一张网页自动适应不同大小的屏幕，根据屏幕宽度，自动调整布局（layout）。.自适应网页设计可以给站点带来更多的多媒体元素(视频和音频).，且非常方便。多媒体HTML5的优点？新标签的引入，各浏览器之间将缺少一种统一的数据描述格式，造成用户体验不佳。并非所有浏览器所支持HTML5设立了所有技术开放原则，Opera捐献了CSS技术，

3、而在视频格式方面，世界各大互联网公司正在为具体标准进行争论，这可能影响HTML5标准的分流，分两大阵营。Google，Opera，火狐，和苹果公司。存在争议HTML5的缺点？什么是HTML5HTML5的特点HTML5的新特性简介+趋势优势&略势实例的演示什么是HTML5HTML5的特点HTML5的新特性简介+趋势优势&略势实例的演示新的表单功能Canvas元素绘图01020304Most jurisdictions require companies to prepare and disclose annual reports,and many require the annual repor

4、t to be filed at the companys registry.HTML5的新特性实例！audio音频标签Video视频标签标签，包含多种类标签，包含多种类型，用于收集特定数据。型，用于收集特定数据。可用于所有浏览器。可用于所有浏览器。This is a sample text.Insert your desired text here.Again,this is a dummy text,enter your own text here.This is a sample text.Insert your desired text here.新的表单功能html5中新的表单 co

5、lor datetime-local email numbrt range time tel url week This is a sample text.Insert your desired text here.Again,this is a dummy text,enter your own text here.This is a sample text.Insert your desired text here.audio音频标签This is a sample text.Insert your desired text here.Again,this is a dummy text,

6、enter your own text here.This is a sample text.Insert your desired text here.Video视频标签 画布是一个矩形区域，您可以控制其每一像素。通过通过HTML5的的元素来元素来使用使用JavaScript绘制形状和图绘制形状和图形，并在形，并在Web页面上创建动画，页面上创建动画，而这些并不需要通过其他语言而这些并不需要通过其他语言（SVG，Flash）来实现。）来实现。Canvas元素绘图html5 canvas 渐变色矩形Your browser does not support the canvas element

7、.var c=document.getElementById(myCanvas);var cxt=c.getContext(2d);var grd=cxt.createLinearGradient(0,0,800,400);grd.addColorStop(0,#FF0000);grd.addColorStop(1,#00FF00);cxt.fillStyle=grd;cxt.fillRect(0,0,800,400);画布是一个矩形区域，您可以控制其每一像素。通过通过HTML5的的元素来元素来使用使用JavaScript绘制形状和图绘制形状和图形，并在形，并在Web页面上创建动画，页面上创建

8、动画，而这些并不需要通过其他语言而这些并不需要通过其他语言（SVG，Flash）来实现。）来实现。Canvas元素绘图/消失的正方型html5 canvas 消失的正方形 Your browser does not support the canvas element./创建一个画布，双击元素时调用擦除函数/加入JavaScript，绘制正方形function drawSquare()var canvas=document.getElementById(myCanvas);var context=canvas.getContext(2d);context.fillStyle=rgb(13,11

9、8,208);context.fillRect(30,30,140,140);/在JavaScript中创建一个擦除函数function eraseSquare()var canvas=document.getElementById(myCanvas);canvas.width=canvas.width;画布是一个矩形区域，您可以控制其每一像素。通过通过HTML5的的元素来元素来使用使用JavaScript绘制形状和图绘制形状和图形，并在形，并在Web页面上创建动画，页面上创建动画，而这些并不需要通过其他语言而这些并不需要通过其他语言（SVG，Flash）来实现。）来实现。Canvas元素绘图

10、html5 canvas 八角形Your browser does not support the canvas element.var canvas=document.getElementById(myCanvas);var context=canvas.getContext(2d);/1.开始绘制路径，将绘制点移动至200,0.context.beginPath();context.moveTo(200,0);/2.绘制一条400,0的线。context.lineTo(400,0);/3.绘制7条分别到600,200；600,400；400,600；200,600；0,400；以及0,20

11、0；context.lineTo(600,200);context.lineTo(600,400);context.lineTo(400,600);context.lineTo(200,600);context.lineTo(0,400);context.lineTo(0,200);/闭合路径context.closePath();/将填充色设置为蓝色context.fillStyle=#0000ff;/填充该八角形context.fill();context.lineWidth=2;THANKS此此课件下件下载可自行可自行编辑修改，修改，仅供参考！供参考！感感谢您的支持，我您的支持，我们努力做得更好！努力做得更好！谢谢!