欢迎进入武汉轻洽网络技术有限公司官方网站!
服务热线:027-51831034,13971151027
   4年前 (2017-06-09)  HTML5 |   抢沙发  17 
文章评分 0 次,平均分 0.0

HTML5简介

HTML5 将成为 HTML、XHTML 以及 HTML DOM 的新标准。
HTML5 是 W3C 与 WHATWG 合作的结果。WHATWG 致力于 web 表单和应用程序,而 W3C 专注于 XHTML 2.0。在 2006 年,双方决定进行合作,来创建一个新版本的 HTML。

为 HTML5 建立的一些规则:
新特性应该基于 HTML、CSS、DOM 以及 JavaScript。

减少对外部插件的需求(比如 Flash)

更优秀的错误处理

更多取代脚本的标记

HTML5 应该独立于设备

开发进程应对公众透明

HTML5 中的一些有趣的新特性:
用于绘画的 canvas 元素

用于媒介回放的 video 和 audio 元素

对本地离线存储的更好的支持

新的特殊内容元素,比如 article、footer、header、nav、section

新的表单控件,比如 calendar、date、time、email、url、search

HTML5视频

直到现在,仍然不存在一项旨在网页上显示视频的标准。
当前,video 元素支持三种视频格式:

Ogg = 带有 Theora 视频编码和 Vorbis 音频编码的 Ogg 文件
MPEG4 = 带有 H.264 视频编码和 AAC 音频编码的 MPEG 4 文件
WebM = 带有 VP8 视频编码和 Vorbis 音频编码的 WebM 文件

插入一个视频,并添加播放按钮,如果浏览器不支持显示提示文字

使用DOM进行控制视频的播放,并可调整窗口大小

HTML5音频

直到现在,仍然不存在一项旨在网页上播放音频的标准。
今天,大多数音频是通过插件(比如 Flash)来播放的。然而,并非所有浏览器都拥有同样的插件。

当前,audio 元素支持三种音频格式:

Ogg Vorbis MP3 Wav

HTML5拖放 [draggable]

在 HTML5 中,拖放是标准的一部分,任何元素都能够拖放,即抓取对象以后拖到另一个位置。

HTML5画布 [canvas]

HTML5 的 canvas 元素使用JavaScript在网页上绘制图像。
画布是一个矩形区域,您可以控制其每一像素。canvas 拥有多种绘制路径、矩形、圆形、字符以及添加图像的方法。

HTML5矢量图 [SVG]

什么是SVG ?

SVG 指可伸缩矢量图形 (Scalable Vector Graphics)
SVG 用于定义用于网络的基于矢量的图形
SVG 使用 XML 格式定义图形
SVG 图像在放大或改变尺寸的情况下其图形质量不会有损失
SVG 是万维网联盟的标准

SVG 的优势:

SVG 图像可通过文本编辑器来创建和修改
SVG 图像可被搜索、索引、脚本化或压缩
SVG 是可伸缩的
SVG 图像可在任何的分辨率下被高质量地打印
SVG 可在图像质量不下降的情况下被放大

Canvas VS SVG

Canvas

Canvas 通过 JavaScript 来绘制 2D 图形。
Canvas 是逐像素进行渲染的。
在canvas中,一旦图形被绘制完成,它就不会继续得到浏览器的关注。如果其位置发生变化,那么整个场景也需要重新绘制,包括任何或许已被图形覆盖的对象。

SVG

SVG 是一种使用 XML 描述 2D 图形的语言。
SVG 基于 XML,这意味着 SVG DOM 中的每个元素都是可用的。您可以为某个元素附加 JavaScript 事件处理器。
在 SVG 中,每个被绘制的图形均被视为对象。如果 SVG 对象的属性发生变化,那么浏览器能够自动重现图形。

 

除特别注明外,本站所有文章均为轻洽网络原创,转载请注明出处来自http://www.qingqia.net/267.html

关于

发表评论

暂无评论

切换注册

登录

忘记密码 ?

您也可以使用第三方帐号快捷登录

切换登录

注册

扫一扫二维码分享