HTML最新规范HTML5总括ca88手机版登录网页,HTML最新专业HTML5总括

写在前方

   
HTML5出来已经很久了,可是由于自家不是规范搞前端的,只明白有那几个东西,具体概念有点模糊(其实就是一名目繁多标准规范啦);因而二零一八年(2015.11.09),专门对HTML5做了个简易的下结论,前些天刚刚看到,整理一下置于本人的博客,以免丢失。有错误请指正。

  别的,转发请声明链接http://www.cnblogs.com/chenpi/p/5578011.html,就算内容相比较不难,但也是花了很多岁月整理的。

HTML最岁旦规HTML5计算(一定要看),htmlhtml5计算不可不看

HTML5出去已经很久了,不过由于自个儿不是搞前端的,只知道有其一东西,具体概念有点模糊(其实就是一种类标准规范啦);因而二〇一八年,专门对HTML5做了个简易的统计,明日刚刚看到,整理一下平放自个儿的博客,以防遗失。有错误请指正,我是前者菜鸟。

先来个目录,如下:

•什么是HTML5

•HTML5上扬历史

•HTML5详实介绍

•录制/音频 、画布 & SVG 、可编制内容 & 拖放、Web存储、Web Worker
、服务器发送事件、表单增强效率、语义化标记、越来越多HTML5业内

•HTML5实例分析

•飞翔的鸟类

•柱状图

•HTML5进步展望

•参考资源

什么是HTML5

简单来说地说,HTML5就是一多元用来制定现代富Web内容的相关技术的总称。

HTML5 ≈ HTML5核心标准 + CSS 3 + JavaScript; 
其中HTML5和CSS首要承担界面,JavaScript负责逻辑处理;

      ca88手机版登录网页 1

目标:裁减网络富应用(RIA )对Flash、Silverpght、Java
Applet等的借助,并且提供更加多能有效抓实网络使用的API。

如下图为卓越的RIA(Rich Internet
Apppcations)网页,包蕴部分图片,视频,游戏等:

      ca88手机版登录网页 2

HTML5提升历史

二零零四年,WHATWG(网页超文本技术工作小组)指出草案Web Apppcations
1.0,即HTML5的前身;

二零零七年,W3C同意采用HTML5用作专业,并确立了新的HTML工作社团;

二零一四年12月28日,W3C正式颁发HTML5.0推荐标准;

二零一六年初前,陈设揭橥HTML 5.1;

前景,待HTML5.1发表后,工作组会重复HTML5.1步骤再搞一个新的HTML5.2,继续周详、丰富功用。

如下表格为HTML 5正式演进历程:

2012 plan

2012

2013

2014

2015

HTML 5.0

候选版

征求评价

推荐标准

 

HTML 5.1

第一工作草案

 

最后召集

候选版

HTML 5.2

     

第一工作草案

Tips:

Q:什么是WHATWG?

A:Mozilla基金会与Opera软件公司于二〇〇四年8月向W3C提交了一份立场文件遭否决,
Mozilla、Opera和Apple便自立门户创建了WHATWG(网页超文本技术工作小组),同时也提议Web
Apppcations 1.0。

Q:HTML5.0与HTML5.1的区别?

A:5.1是5.0的超集,5.0中只包括了安宁个性,5.1中涵盖了5.0中省略掉的不稳定特性和别的新特征;目标:为了尽快及时已毕HTML5,W3C放弃一些不安静、有争议的要素,等到后续的5.1版本再考虑。

HTML5详实介绍HTML5 视频 & 音频

 直距今,如故不设有一项目的在于网页上显示视频、音频的科班,大部分因此插件(比如
Flash)来突显的;

但是,有了HTML5,咱们得以不借助于任何插件,不难的使用video和audio标签来贯彻音录制的广播,如下代码:

XML/HTML Code复制内容到剪贴板

<video width=”320″ height=”240″ controls=”controls”>  

  <source src=”/i/movie.ogg” type=”video/ogg”>  

  <source src=”/i/movie.mp4″ type=”video/mp4″>  

  Your browser does not support the video tag.   

</video>  

XML/HTML Code复制内容到剪贴板

<audio controls=”controls”>  

  <source src=”/i/song.ogg” type=”audio/ogg”>  

  <source src=”/i/song.mp3″ type=”audio/mpeg”>  

Your browser does not support the audio element.   

</audio>  

如下,为视频和韵律的功力图:

    ca88手机版登录网页 3

Tips:
*
1、HTML5 <video> 、< audio
>成分拥有方法、属性和事件。可以用js动态控制摄像 &
音频播放暂停等动作; 2、Video 、audio成分允许三个 source 成分。source
成分可以链接分裂的文件。浏览器将应用第四个可辨识的格式*

 

PS:YouTube暗中同意就是运用HTML5播放器,能够登录其官网www.youtube.com查看源码,如下:

ca88手机版登录网页 4

HTML5 Canvas & SVG

画布Canvas

HTML5 的 canvas 元素使用 JavaScript
在网页上绘制图像,拥有三种制图路径、矩形、圆形、字符以及丰裕图像的章程。

XML/HTML Code复制内容到剪贴板

一般来说,为意义图:

ca88手机版登录网页 5

可伸缩矢量图形 (Scalable Vector Graphics)

XML/HTML Code复制内容到剪贴板

ca88手机版登录网页 6

Canvas & SVG 的宽泛应用

动用canvas和SVG可以兑现无数小应用,特别是canvas,如下图例子:

ca88手机版登录网页 7

HTML5 可编制内容 & 拖放

Contenteditable全局属性

Contenteditable可用于落到实处网页编辑器,当前游人如织网页编辑器都用这脾特性完成,如下图:

ca88手机版登录网页 8

Drag 和 drop

HTML5
的拖放将会把与用户交互带向另一个等级,并将会对哪些设计用户交互发生相当首要影响。

重视的风浪函数:Ondragstart()、Ondragover()、Ondrop();

一般来说为一个代码示例,将一个p拖放到另一个p里:

JavaScript Code复制内容到剪贴板

ca88手机版登录网页 9

HTML5 Web存储

在讲HTML5 的Web存储此前,先来说说cookie逆风局,紧要有以下三点:

Cookie会被增大在各样HTTP请求中,无形中增添了流量。

是因为在HTTP请求中的Cookie是堂而皇之传递的,所以安全性成难题。(除非用HTTPS)

Cookie的轻重限制在4KB左右。对于复杂的仓储须求来说是不够用的。

再来看看HTML5 Web存储的优势:

从未有过额外的的呼吁尾部数据

增加的措施去设置、读取、移除数据

默许5MB存储限制

在HTML5中,Web存储有三种样式:localStorag、sessionStorage,如下:

localStorage 

     存储的多寡尚猪时间范围;

JavaScript Code复制内容到剪贴板

sessionStorage

当用户关闭浏览器窗口后,数据会被删除 

JavaScript Code复制内容到剪贴板

*Tips: Cookie是必备的:Cookie的功能是与服务器实行交互,作为HTTP规范的一片段而存在
,而Web Storage仅仅是为了在该地“存储”数据而生。*

HTML5 Web Workers

web worker 是运作在后台的
JavaScript,独立于任何脚本,不会影响页面的性质(JS三十二线程工作化解方案)。

Web
Worker的基本原理就是在眼下javascript的主线程中,使用Worker类加载一个javascript文件来开辟一个新的线程,起到互不阻塞执行的功能,并且提供主线程和新线程之间数据互换的接口:postMessage,onmessage。

优势:异步执行复杂总括,不影响页面的展现

 如下为一个求和的代码示例:

JavaScript Code复制内容到剪贴板

demo_workers.js文件,其中的postMessage() 方法 ,用于向 HTML
页面传回一段消息。

JavaScript Code复制内容到剪贴板

Tips:

1.不大概跨域加载JS

2.worker内代码不大概访问DOM

HTML 5 服务器发送事件

古板的网页都是浏览器向服务器“查询”数据,不过众多场馆,最实用的不二法门是服务器向浏览器“发送”数据。比如,每当收到新的电子邮件,服务器就向浏览器发送一个“布告”,那要比浏览器按时向服务器查询(polpng)更有功能。

HTML5 服务器发送事件(server-sent event)允许网页得到来自服务器的翻新;

举个例证,如下,其中服务器端使用Java的Struts
2框架,会向浏览器发送服务器最新的时刻数额:

服务端代码:

JavaScript Code复制内容到剪贴板

JavaScript Code复制内容到剪贴板

客户端代码:

JavaScript Code复制内容到剪贴板

HTML 5 表单增强成效

新的 Input 类型

•–email
•–url
•–number
•–range
•–Date pickers (date, month, week, time, datetime, datetime-local)
•–search
•–color

下图为各种input成分的成效图:

下图为各类input成分的出力图:

ca88手机版登录网页 10

HTML5 的新的表单成分

–datapst

–keygen

–output

下图为datapst的示例:

ca88手机版登录网页 11

HTML5 的新的表单属性

–新的 form 属性:

•autocomplete

•Novapdate

–新的 input 属性:

•autocomplete

•autofocus

•form

•height 和 width

•pst

•min, max 和 step

•multiple

•pattern (regexp)

•placeholder

•Required

•form overrides (formaction, formenctype, formmethod, formnovapdate,
formtarget)

下表为种种浏览器对表单属性的帮助景况:

Input type

IE

Firefox

Opera

autocomplete

8.0

3.5

9.5

autofocus

No

No

10.0

form

No

No

9.5

form overrides

No

No

10.5

height and width

8.0

3.5

9.5

pst

No

No

9.5

min, max and step

No

No

9.5

multiple

No

3.5

No

novapdate

No

No

No

pattern

No

No

9.5

placeholder

No

No

No

required

No

No

9.5

HTML5语义化标记

HTML5
可以利用语义化的竹签代替多量的架空的p标签。那种语义化的特色不但提高了网页的身分和语义,并且收缩了原先用于CSS或JS调用的class和id属性。

ca88手机版登录网页 12

更多HTML 5标准

HTML5引进标准(W3C官网推荐标准)

http://www.w3.org/TR/html5/

仍然参考w3school

HTML5 完整的新标签

http://www.w3school.com.cn/tags/index.asp

HTML 全局属性

http://www.w3school.com.cn/tags/html\_ref\_standardattributes.asp

大局事件性质

http://www.w3school.com.cn/tags/html\_ref\_eventattributes.asp

HTML5实例分析飞翔的鸟类

据悉Phaser(开源的HTML5 2D戏耍支付框架),主要需求编制以下多个函数:

Preload函数(执行一遍):

加载资源(背景、图片等资源)

Create函数(执行五遍):

给鸟一个向下的重力,不受控制的时候自动下降

添加键盘空格事件,按下空格时改变小鸟坐标

创建墙壁事件,每隔1.5s,出现一排墙壁往左移动(中间随机隔3块)

Update函数(每帧执行):

认清是不是飞出边界

判断是还是不是蒙受墙壁

职能图如下:

ca88手机版登录网页 13

柱状图表

最主要步骤:

利用canvas画出图形

概念鼠标点击事件(获取鼠标坐标来分歧点击的目标),$(canvas).on(“cpck”,mouseCpck); 

概念鼠标hover事件(获取鼠标坐标来区分hover的对象),$(canvas).on(“mousemove”,mouseMove);

效果图:

ca88手机版登录网页 14

HTML5升华展望

脚下各大浏览器对HTML5支撑意况(满分是555分),http://html5test.com/

一句话,无论是桌面照旧手机浏览器,谷歌对HTML5的支撑最周密。

ca88手机版登录网页 15

各大商家行动

–谷歌(谷歌),发表活动转换Flash广告为HTML5版本;chrome浏览器

–Youtube ,使用HTML 5的播放器;

–亚马逊,公布停用所有Flash广告;

–腾讯,微信朋友圈小游戏、贺卡或约请函; QQ空间H5游戏&helpp;

–百度,直达号;

–阿里,UC浏览器,手机TaobaoH5游戏&helpp;

ca88手机版登录网页 16

如上那篇HTML最新专业HTML5计算(非看不可)就是作者分享给我们的全部内容了,希望能给大家一个参考,也指望大家多多帮忙帮客之家。

原文地址:http://www.cnblogs.com/chenpi/archive/2016/06/12/5578011.html

http://www.bkjia.com/HTML5/1136940.htmlwww.bkjia.comtruehttp://www.bkjia.com/HTML5/1136940.htmlTechArticleHTML最新标准HTML5总结(必看),htmlhtml5总结必看
HTML5出去已经很久了,然则由于自个儿不是搞前端的,只晓得有那个事物,具体概念有点模糊(…

什么是HTML5

  简单地说,HTML5就是一多重用来制定现代富Web内容的相干技术的总称。

  HTML5 ≈ HTML5中央标准 + CSS 3 + JavaScript; 
其中HTML5和CSS紧要承担界面,JavaScript负责逻辑处理;

      ca88手机版登录网页 17

  目标:裁减互连网富应用(RIA )对Flash、Silverlight、Java
Applet等的依靠,并且提供越多能有效拉长互连网利用的API。

  如下图为独立的RIA(Rich Internet
Applications)网页,包罗部分图纸,录像,游戏等:

      ca88手机版登录网页 18

HTML5发展历史

  • 二〇〇四年,WHATWG(网页超文本技术工作小组)提议草案Web Applications
    1.0,即HTML5的前身;
  • 二〇〇七年,W3C同意选择HTML5看作正式,并创设了新的HTML工作团队;
  • 二〇一四年5月28日,W3C正式公布HTML5.0推荐标准;
  • 二〇一六年终前,安插揭橥HTML 5.1;
  • 前途,待HTML5.1公布后,工作组会重复HTML5.1步骤再搞一个新的HTML5.2,继续周详、丰裕成效。

一般来说表格为HTML 5专业演进历程:

2012 plan

2012

2013

2014

2015

HTML 5.0

候选版

征求评价

推荐标准

 

HTML 5.1

第一工作草案

 

最后召集

候选版

HTML 5.2

     

第一工作草案

Tips:

Q:什么是WHATWG?
A:Mozilla基金会与Opera软件集团于二〇〇四年五月向W3C提交了一份立场文件遭否决,
Mozilla、Opera和Apple便自立门户成立了WHATWG(网页超文本技术工作小组),同时也提议Web
Applications 1.0。

Q:HTML5.0与HTML5.1的区别?
A:5.1是5.0的超集,5.0中只含有了平安天性,5.1中富含了5.0中省略掉的不安定本性和任何新特色;目的:为了尽早及时到位HTML5,W3C扬弃一些不平静、有争辩的成分,等到后续的5.1本子再考虑。

HTML5详细介绍

HTML5 视频 & 音频

    
直于今,照旧不设有一项意在网页上突显录制、音频的正式,大部分经过插件(比如
Flash)来显示的;

  可是,有了HTML5,我们得以不倚重任何插件,简单的行使video和audio标签来兑现音视频的播报,如下代码:

<video width="320" height="240" controls="controls">
  <source src="/i/movie.ogg" type="video/ogg">
  <source src="/i/movie.mp4" type="video/mp4">
  Your browser does not support the video tag.
</video>

<audio controls="controls">
  <source src="/i/song.ogg" type="audio/ogg">
  <source src="/i/song.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>

  如下,为录制和韵律的功能图:

    ca88手机版登录网页 19

Tips:
1、HTML5 <video> 、< audio
>成分拥有方法、属性和事件。能够用js动态控制摄像 &
音频播放暂停等动作;

2、Video 、audio成分允许多少个 source
成分。source
成分可以链接差其他公文。浏览器将选拔第三个可识其余格式

 

PS:YouTube专擅认同就是利用HTML5播放器,可以登录其官网www.youtube.com查看源码,如下:

ca88手机版登录网页 20

HTML5 Canvas & SVG

画布Canvas

  HTML5 的 canvas 成分使用 JavaScript
在网页上绘制图像,拥有三种绘制路径、矩形、圆形、字符以及丰裕图像的不二法门。

<canvas id="myCanvas" width="200" height="100" style="border:1px solid #c3c3c3;">
Your browser does not support the canvas element.
</canvas>
<script type="text/javascript">
var c=document.getElementById("myCanvas");
var cxt=c.getContext("2d");
cxt.moveTo(10,10);
cxt.lineTo(150,50);
cxt.lineTo(10,50);
cxt.stroke();
</script>

  如下,为功效图:

  ca88手机版登录网页 21

可伸缩矢量图形 (Scalable Vector Graphics)

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="190">
   <polygon points="100,10 40,180 190,60 10,60 160,180"
   style="fill:red;stroke:blue;stroke-width:3;fill-rule:evenodd;" />
</svg>

ca88手机版登录网页 22

Canvas & SVG 的宽泛应用

动用canvas和SVG可以兑现无数小应用,特别是canvas,如下图例子:

ca88手机版登录网页 23

HTML5 可编制内容 & 拖放

Contenteditable全局属性

  Contenteditable可用于落到实处网页编辑器,当前广大网页编辑器都用那本性子达成,如下图:

  ca88手机版登录网页 24

Drag 和 drop

  HTML5
的拖放将会把与用户交互带向另一个品级,并将会对怎么筹划用户交互发生第一影响。

  主要的轩然大波函数:Ondragstart()、Ondragover()、Ondrop();

  如下为一个代码示例,将一个div拖放到另一个div里:

<script type="text/javascript">
function allowDrop(ev)
{
    ev.preventDefault();
}
function drag(ev)
{
    ev.dataTransfer.setData("Text",ev.target.id);
}
function drop(ev)
{
    ev.preventDefault();
    var data=ev.dataTransfer.getData("Text");
    ev.target.appendChild(document.getElementById(data));
}
</script>
</head>
<body>
    <div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)">
        <img src="/i/w3school_logo_black.gif" draggable="true" ondragstart="drag(event)" id="drag1" />
    </div>
    <div id="div2" ondrop="drop(event)" ondragover="allowDrop(event)"></div>

ca88手机版登录网页 25

HTML5 Web存储

  在讲HTML5 的Web存储以前,先来说说cookie逆风局,首要有以下三点:

  1. Cookie会被增大在逐个HTTP请求中,无形中扩大了流量。
  2. 由于在HTTP请求中的Cookie是当着传递的,所以安全性成难点。(除非用HTTPS)
  3. Cookie的尺寸限制在4KB左右。对于复杂的仓储须求来说是不够用的。

  再来看看HTML5 Web存储的优势:

  1. 不曾额外的的呼吁底部数据
  2. 增加的法门去设置、读取、移除数据
  3. 暗中认可5MB存储限制

  在HTML5中,Web存储有三种样式:localStorag、sessionStorage,如下:

  • localStorage 

     存储的多寡尚狗时间限定;

<script type="text/javascript">
localStorage.lastname="Smith";
document.write("Last name: " + localStorage.lastname);
</script>
  • sessionStorage

  当用户关闭浏览器窗口后,数据会被删除 

<script type="text/javascript">
sessionStorage.lastname="Smith";
document.write(sessionStorage.lastname);
</script>

Tips:
Cookie是必不可少的:Cookie的效能是与服务器进行交互,作为HTTP规范的一有些而留存
,而Web Storage仅仅是为了在地头“存储”数据而生。

HTML5 Web Workers

  web worker 是运作在后台的
JavaScript,独立于其余脚本,不会影响页面的个性(JS四线程工作解决方案)。

  Web
Worker的基本原理就是在当下javascript的主线程中,使用Worker类加载一个javascript文件来开辟一个新的线程,起到互不阻塞执行的意义,并且提供主线程和新线程之间数据互换的接口:postMessage,onmessage。

  优势:异步执行复杂统计,不影响页面的浮现

   如下为一个求和的代码示例:

<script>
var w;

function startWorker() {
    if (typeof (Worker) !== "undefined") {
        if (typeof (w) == "undefined") {
           w = new Worker("rs/demo_workers.js");
        }
        w.onmessage = function(event) {
           document.getElementById("result").innerHTML = event.data;
        };
    } else {
        document.getElementById("result").innerHTML = "Sorry, your browser does not support Web Workers...";
    }
}

function stopWorker() {
    w.terminate();
}
</script>

demo_workers.js文件,其中的postMessage() 方法 ,用于向 HTML
页面传回一段音信。

var i=0;

function timedCount()
{
    i=i+1;
    postMessage(i);
    setTimeout("timedCount()",500);
}

timedCount();

Tips:
1.不可以跨域加载JS
2.worker内代码不可以访问DOM

HTML 5 服务器发送事件

  传统的网页都以浏览器向服务器“查询”数据,可是不少场面,最有效的法子是服务器向浏览器“发送”数据。比如,每当收到新的电子邮件,服务器就向浏览器发送一个“文告”,那要比浏览器按时向服务器询问(polling)更有功效。

  HTML5 服务器发送事件(server-sent
event)允许网页得到来自服务器的翻新;

  举个例证,如下,其中服务器端使用Java的Struts
2框架,会向浏览器发送服务器最新的光阴数额:

服务端代码:

public class SSE extends ActionSupport {
    private InputStream sseStream;
    public InputStream getSseStream() {
        return sseStream;
    }
    public String handleSSE() {
        System.out.println("Inside handleSSE() ");
        String result = "data: "+new Date().toString() + "\n\n";
        sseStream = new ByteArrayInputStream(result.getBytes() );
        System.out.println("Exiting handleSSE() ");
        return SUCCESS;
    }
}

 <action name="handleSSE" class="pichen.java.html5.test.SSE" method="handleSSE">
            <result name="success" type="stream">
                <param name="contentType">text/event-stream</param>
                <param name="inputName">sseStream</param>
            </result>
</action>

客户端代码:

<p><output id="result">OUTPUT VALUE</output></p>
<script>
(function(global, window, document) {
  'use strict';
  function main() {
    window.addEventListener('DOMContentLoaded', contentLoaded);
  }
  function contentLoaded() {
    var result = document.getElementById('result');
    var stream = new EventSource('handleSSE.action');
    stream.onmessage=function(event){
        var data = event.data+" by onmessage";
        result.value = data;
    }
  }
  main();
})(this, window, window.document);
</script>

HTML 5 表单增强功能

新的 Input 类型

  • –email
  • –url
  • –number
  • –range
  • –Date pickers (date, month, week, time, datetime, datetime-local)
  • –search
  • –color

  下图为种种input成分的效果图:

  ca88手机版登录网页 26

HTML5 的新的表单元素

  • –datalist
  • –keygen
  • –output

 

  下图为datalist的示例:

  ca88手机版登录网页 27

HTML5 的新的表单属性

–新的 form 属性:

•autocomplete

•Novalidate

–新的 input 属性:

•autocomplete

•autofocus

•form

•height 和 width

•list

•min, max 和 step

•multiple

•pattern (regexp)

•placeholder

•Required

•form overrides (formaction, formenctype, formmethod, formnovalidate,
formtarget)

 

  下表为各类浏览器对表单属性的支持情况:

Input type

IE

Firefox

Opera

autocomplete

8.0

3.5

9.5

autofocus

No

No

10.0

form

No

No

9.5

form overrides

No

No

10.5

height and width

8.0

3.5

9.5

list

No

No

9.5

min, max and step

No

No

9.5

multiple

No

3.5

No

novalidate

No

No

No

pattern

No

No

9.5

placeholder

No

No

No

required

No

No

9.5

 

HTML5语义化标记

  HTML5
能够行使语义化的价签代替大批量的抽象的div标签。那种语义化的表征不但荣升了网页的品质和语义,并且减弱了在此此前用于CSS或JS调用的class和id属性。

  ca88手机版登录网页 28

更多HTML 5标准

HTML5引进标准(W3C官网推荐标准)

http://www.w3.org/TR/html5/

 

抑或参考w3school

 

HTML5 完整的新标签

http://www.w3school.com.cn/tags/index.asp

HTML 全局属性

http://www.w3school.com.cn/tags/html_ref_standardattributes.asp

全局事件性质

http://www.w3school.com.cn/tags/html_ref_eventattributes.asp

HTML5实例分析

翱翔的鸟类

据悉Phaser(开源的HTML5 2D游乐支付框架),首要要求编制以下多少个函数:

Preload函数(执行一次):

  1. 加载资源(背景、图片等资源)

Create函数(执行三遍):

  1. 给鸟一个向下的动力,不受控制的时候自动下跌
  2. 添加键盘空格事件,按下空格时改变小鸟坐标
  3. 创办墙壁事件,每隔1.5s,出现一排墙壁往左移动(中间随机隔3块)

Update函数(每帧执行):

  1. 判定是还是不是飞出边界
  2. 认清是不是碰到墙壁

  效果图如下:

  ca88手机版登录网页 29

柱状图表

首要步骤:

  1. 运用canvas画出图形
  2. 概念鼠标点击事件(获取鼠标坐标来分裂点击的目的),$(canvas).on(“click”,mouseClick); 
  3. 概念鼠标hover事件(获取鼠标坐标来分别hover的靶子),$(canvas).on(“mousemove”,mouseMove);

效果图:

  ca88手机版登录网页 30

HTML5前进展望

  当前各大浏览器对HTML5支撑意况(满分是555分),http://html5test.com/

  一句话,无论是桌面如故手机浏览器,谷歌对HTML5的支撑最完美。

  ca88手机版登录网页 31

  各大集团行动

–谷歌(谷歌),公布活动转换Flash广告为HTML5版本;chrome浏览器

–Youtube ,使用HTML 5的播放器;

–亚马逊,公布停用所有Flash广告;

–腾讯,微信朋友圈小游戏、贺卡或邀约函; QQ空间H5游戏…

–百度,直达号;

–阿里,UC浏览器,手机TaobaoH5游戏…

ca88手机版登录网页 32

参考资料

维基百科

https://zh.wikipedia.org/wiki/HTML5

W3C官网,HTML5引进标准

http://www.w3.org/TR/html5/

测试浏览器对HTML5支撑情况

http://html5test.com/

HTML5应用及源码

http://www.html5tricks.com/

HTML5实例源码

http://html5demos.com

W3School

http://www.w3school.com.cn/

谷歌、百度

相关文章

You can leave a response, or trackback from your own site.

Leave a Reply

网站地图xml地图