HTML5介绍ppt.ppt
HTML5介绍ppt什么是HTML5HTML5的特点HTML5的新特性简介+趋势优势&略势实例的演示2013年全球有10亿手机浏览器支持HTML5。HTML5将成为未来5-10年内,移动互联网领域的主宰者。许多游戏开发商都被Facebook或者Zynga推动着发展,而未来的Facebook应用生态系统是基于HTML5的.游戏开发者引领从如今移动应用层出不穷,在这个智能手机和将平板电脑大爆炸的时代,移动优先已成趋势,不管是开发什么,都以移动为主。.移动优先发展趋势HTML5将成为主流什么是HTML5HTML5的特点HTML5的新特性简介+趋势优势&略势实例的演示什么是HTML5HTML5的特点HTML5的新特性简介+趋势优势&略势实例的演示跨平台性非常强大,可以轻易的移植,这也是大多数人对HTML5有兴趣的主要原因。多设备跨平台游戏客户端每次都要更新,很麻烦。可是更新HTML5游戏就好像更新页面一样,是马上的、即时的更新。即时更新“一次设计,普遍适用”,让同一张网页自动适应不同大小的屏幕,根据屏幕宽度,自动调整布局(layout)。.自适应网页设计可以给站点带来更多的多媒体元素(视频和音频).,且非常方便。多媒体HTML5的优点?新标签的引入,各浏览器之间将缺少一种统一的数据描述格式,造成用户体验不佳。并非所有浏览器所支持HTML5设立了所有技术开放原则,Opera捐献了CSS技术,而在视频格式方面,世界各大互联网公司正在为具体标准进行争论,这可能影响HTML5标准的分流,分两大阵营。Google,Opera,火狐,和苹果公司。存在争议HTML5的缺点?什么是HTML5HTML5的特点HTML5的新特性简介+趋势优势&略势实例的演示什么是HTML5HTML5的特点HTML5的新特性简介+趋势优势&略势实例的演示新的表单功能Canvas元素绘图01020304Most jurisdictions require companies to prepare and disclose annual reports,and many require the annual report 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中新的表单 color 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,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.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页面上创建动画,页面上创建动画,而这些并不需要通过其他语言而这些并不需要通过其他语言(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,118,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元素绘图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,200;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此此课件下件下载可自行可自行编辑修改,修改,仅供参考!供参考!感感谢您的支持,我您的支持,我们努力做得更好!努力做得更好!谢谢!