为了正常的体验网站，请在浏览器设置里面开启Javascript功能!
分享 首 页 个人中心 意见反馈 帮助中心
首页 > 行业资料 > 互联网

HTML 5(w3c)

2012-05-22 36页 ppt 668KB 30阅读

用户头像

is_496105

暂无简介

举报
HTML 5(w3c)null介绍 介绍 姓名：袁伟 部门：技术部什么是HTML5？什么是HTML5？　　HTML5是一个新的网络标准，现在仍处于发展阶段。目标是取代现有的HTML 4.01和XHTML 1.0 标准。它希望能够减少互联网富应用（RIA)对Flash、Silverlight、JavaFX等的依赖，并且提供更多能有效增强网络应用的API。HTML5新特性HTML5新特性绘画的 元素 和 元素特殊内容元素，比如 article、footer、header、nav、section•对本...
HTML 5(w3c)
null介绍 介绍 姓名：袁伟 部门：技术部什么是HTML5？什么是HTML5？　　HTML5是一个新的网络
标准
excel标准偏差excel标准偏差函数exl标准差函数国标检验抽样标准表免费下载红头文件格式标准下载
，现在仍处于发展阶段。目标是取代现有的HTML 4.01和XHTML 1.0 标准。它希望能够减少互联网富应用（RIA)对Flash、Silverlight、JavaFX等的依赖，并且提供更多能有效增强网络应用的API。HTML5新特性HTML5新特性绘画的 元素 < video >和< audio> 元素特殊内容元素，比如 article、footer、header、nav、section•对本地离线存储的更好的支持 •localStorage - 没有时间限制的数据存储 •sessionStorage - 针对一个 session 的数据存储,HTML 5 视频HTML 5 视频Web 上的视频 直到现在，仍然不存在一项旨在网页上显示视频的标准。 今天，大多数视频是通过插件（比如 Flash）来显示的。然而，并非所有浏览器都拥有同样的插件。 HTML5 规定了一种通过 video 元素来包含视频的标准方法。 视频格式 当前，video 元素支持三种视频格式： Ogg = 带有 Theora 视频编码和 Vorbis 音频编码的 Ogg 文件 MPEG4 = 带有 H.264 视频编码和 AAC 音频编码的 MPEG 4 文件 WebM = 带有 VP8 视频编码和 Vorbis 音频编码的 WebM 文件 如何在 HTML5 中显示视频如何在 HTML5 中显示视频 control 属性供添加播放、暂停和音量控件。 包含宽度和高度属性也是不错的主意。 HTML 5 音频HTML 5 音频Web 上的音频 直到现在，仍然不存在一项旨在网页上播放音频的标准。 今天，大多数音频是通过插件（比如 Flash）来播放的。然而，并非所有浏览都拥有同样的插件。 HTML5 规定了一种通过 audio 元素来包含音频的标准方法。 audio 元素能够播放声音文件或者音频流。 音频格式 当前，audio 元素支持三种音频格式： 如何在 HTML5 中显示音频如何在 HTML5 中显示音频control 属性供添加播放、暂停和音量控件。audio 元素允许多个 source 元素。source 元素可以链接不同的音频文件。 实例： HTML 5 CanvasHTML 5 Canvas什么是 Canvas？ HTML5 的 canvas 元素使用 JavaScript 在网页上绘制图像。 画布是一个矩形区域，您可以控制其每一像素。 canvas 拥有多种绘制路径、矩形、圆形、字符以及添加图像的方法。 创建 Canvas 元素 向 HTML5 页面添加 canvas 元素。 规定元素的 id、宽度和高度： null通过 JavaScript 来绘制： canvas 元素本身是没有绘图能力的。所有的绘制工作必须在 JavaScript 内部完成：JavaScript 使用 id 来寻找 canvas 元素：var c=document.getElementById("myCanvas");var cxt=c.getContext("2d"); 创建 context 对象：getContext("2d") 对象是内建的 HTML5 对象，拥有多种绘制路径、矩形、圆形、字符以及添加图像的方法。null 下面的两行代码绘制一个红色的矩形： cxt.fillStyle="#FF0000"; cxt.fillRect(0,0,150,75); 理解坐标 fillStyle 方法将其染成红色，fillRect 方法规定了形状、位置和尺寸。 fillRect 方法拥有参数 (0,0,150,75)。 意思是：在画布上绘制 150x75 的矩形，从左上角开始 (0,0)。 HTML 5 Web 存储HTML 5 Web 存储在客户端存储数据 HTML5 提供了两种在客户端存储数据的新方法： •localStorage - 没有时间限制的数据存储 •sessionStorage - 针对一个 session 的数据存储 之前，这些都是由 cookie 完成的。但是 cookie 不适合大量数据的存储，因为它们由每个对服务器的请求来传递，这使得 cookie 速度很慢而且效率也不高。 在 HTML5 中，数据不是由每个服务器请求传递的，而是只有在请求时使用数据。它使在不影响网站性能的情况下存储大量数据成为可能。 对于不同的网站，数据存储于不同的区域，并且一个网站只能访问其自身的数据。 localStorage 方法localStorage 方法localStorage 方法存储的数据没有时间限制。 如何创建和访问 localStorage： 实例sessionStorage 方法 sessionStorage 方法针对一个 session 进行数据存储。当用户关闭浏览器窗口后，数据会被删除。Indexed DataBaseIndexed DataBase对于存储少量的数据，Web Storage能够很好的完成任务，但是对大量的结构化数据进行处理时，它就力所不及了，而这正是IndexedDB的应用所在。  IndexedDB严格遵循W3C的同源策略，每个源都拥有独立的存储空间，每个存储空间内又可以创建多个数据库，每个数据库可以包含多个表，每个表都是一个json对象列表，可以存储多个json对象，比如{"name": "sonic", "age": 27}。HTML5 Input 类型HTML5 Input 类型HTML5 新的 Input 类型 HTML5 拥有多个新的表单输入类型。这些新特性提供了更好的输入控制和验证。 •email •url •number •range •Date pickers (date, month, week, time, datetime, datetime-local) •search •colorInput 类型 - email email 类型用于应该包含 e-mail 地址的输入域。 在提交表单时，会自动验证 email 域的值。 Input 类型 - email实例E-mail: Input 类型 - urlInput 类型 - url url 类型用于应该包含 URL 地址的输入域。 在提交表单时，会自动验证 url 域的值。 实例Homepage: Input 类型 - numberInput 类型 - numbernumber 类型用于应该包含数值的输入域。 您还能够设定对所接受的数字的限定： 实例Points: Input 类型 - rangeInput 类型 - rangerange 类型用于应该包含一定范围内数字值的输入域。 range 类型显示为滑动条。 您还能够设定对所接受的数字的限定： 实例Input 类型 - Date PickersInput 类型 - Date PickersHTML5 拥有多个可供选取日期和时间的新输入类型： •date - 选取日、月、年 •month - 选取月、年 •week - 选取周和年 •time - 选取时间（小时和分钟） •datetime - 选取时间、日、月、年（UTC 时间） •datetime-local - 选取时间、日、月、年（本地时间） 下面的例子允许您从日历中选取一个日期： Date: output 元素output 元素output 元素用于不同类型的输出，比如计算或脚本输出： 实例HTML5 表单元素HTML5 表单元素HTML5 拥有若干涉及表单的元素和属性。 介绍以下新的表单元素： •datalist •keygen •output浏览器支持datalist 元素datalist 元素datalist 元素规定输入域的选项列表。 列表是通过 datalist 内的 option 元素创建的。 如需把 datalist 绑定到输入域，请用输入域的 list 属性引用 datalist 的 id： 实例Webpage: keygen 元素keygen 元素keygen 元素的作用是提供一种验证用户的可靠方法。 keygen 元素是密钥对生成器（key-pair generator）。当提交表单时，会生成两个键，一个是私钥，一个公钥。 私钥（private key）存储于客户端，公钥（public key）则被发送到服务器。公钥可用于之后验证用户的客户端证书（client certificate）。 目前，浏览器对此元素的糟糕的支持度不足以使其成为一种有用的安全标准。 实例
Username: Encryption:
HTML5 表单属性HTML5 表单属性涉及
和 元素的新属性。 新的 form 属性： •autocomplete •novalidate 新的 input 属性： •autocomplete •autofocus •form •form overrides (formaction, formenctype, formmethod, formnovalidate, formtarget) •height 和 width •list •min, max 和 step •multiple •pattern (regexp) •placeholder •requiredautofocus 属性autofocus 属性autofocus 属性规定在页面加载时，域自动地获得焦点。 注释：autofocus 属性适用于所有 标签的类型。 实例User name: form 属性form 属性form 属性规定输入域所属的一个或多个表单。 注释：form 属性适用于所有 标签的类型。 form 属性必须引用所属表单的 id： 实例 First name:
Last name: 表单重写属性表单重写属性表单重写属性（form override attributes）允许您重写 form 元素的某些属性设定。表单重写属性有： •formaction - 重写表单的 action 属性 •formenctype - 重写表单的 enctype 属性 •formmethod - 重写表单的 method 属性 •formnovalidate - 重写表单的 novalidate 属性 •formtarget - 重写表单的 target 属性 注释：表单重写属性适用于以下类型的 标签：submit 和 image。
E-mail:



height 和 width 属性height 和 width 属性height 和 width 属性规定用于 image 类型的 input 标签的图像高度和宽度。 注释：height 和 width 属性只适用于 image 类型的 标签。 实例list 属性list 属性list 属性规定输入域的 datalist。datalist 是输入域的选项列表。 注释：list 属性适用于以下类型的 标签：text, search, url, telephone, email, date pickers, number, range 以及 color。 实例Webpage: min、max 和 step 属性min、max 和 step 属性min、max 和 step 属性用于为包含数字或日期的 input 类型规定限定（约束）。 max 属性规定输入域所允许的最大值。 min 属性规定输入域所允许的最小值。 step 属性为输入域规定合法的数字间隔（如果 step="3"，则合法的数是 -3,0,3,6 等）。 注释：min、max 和 step 属性适用于以下类型的 标签：date pickers、number 以及 range。 下面的例子显示一个数字域，该域接受介于 0 到 10 之间的值，且步进为 3（即合法的值为 0、3、6 和 9）： 实例Points: multiple 属性multiple 属性multiple 属性规定输入域中可选择多个值。 注释：multiple 属性适用于以下类型的 标签：email 和 file。 实例Select images: novalidate 属性novalidate 属性novalidate 属性规定在提交表单时不应该验证 form 或 input 域。 注释：novalidate 属性适用于
以及以下类型的 标签：text, search, url, telephone, email, password, date pickers, range 以及 color. 实例 E-mail:
pattern 属性pattern 属性pattern 属性规定用于验证 input 域的模式（pattern）。 模式（pattern） 是正则表达式。您可以在我们的 JavaScript 教程中学习到有关正则表达式的内容。 注释：pattern 属性适用于以下类型的 标签：text, search, url, telephone, email 以及 password。 下面的例子显示了一个只能包含三个字母的文本域（不含数字及特殊字符）： 实例Country code: placeholder 属性placeholder 属性placeholder 属性提供一种提示（hint），描述输入域所期待的值。 注释：placeholder 属性适用于以下类型的 标签：text, search, url, telephone, email 以及 password。 提示（hint）会在输入域为空时显示出现，会在输入域获得焦点时消失： 实例required 属性required 属性required 属性规定必须在提交之前填写输入域（不能为空）。 注释：required 属性适用于以下类型的 标签：text, search, url, telephone, email, password, date pickers, number, checkbox, radio 以及 file。 实例Name: 谢谢！谢谢！
/
本文档为【HTML 5(w3c)】，请使用软件OFFICE或WPS软件打开。作品中的文字与图均可以修改和编辑， 图片更改请在作品中右键图片并更换，文字修改请直接点击文字进行修改，也可以新增和删除文档中的内容。
[版权声明] 本站所有资料为用户分享产生，若发现您的权利被侵害，请联系客服邮件isharekefu@iask.cn，我们尽快处理。 本作品所展示的图片、画像、字体、音乐的版权可能需版权方额外授权，请谨慎使用。 网站提供的党政主题相关内容(国旗、国徽、党徽..)目的在于配合国家政策宣传，仅限个人学习分享使用，禁止用于任何广告和商用目的。
相关资料
热门搜索
你可能还喜欢
最新资料 资料动态 专题动态

免费

已有人下载

立即下载
关于我们 侵权处理 投诉反馈 帮助中心 网站地图
京ICP证000007-6 爱问文库-Copyright © 版权所有

浙公网安备 33021202002483

搜索

热门搜索

历史搜索

    清空历史搜索