html5_IT技术网

详解Html5原生拖拽

最近的一次项目开发中用到了H5的拖拽功能,由于现有项目使用的是VUE全家桶,使用了vuedragable这个插件,但是整个过程是比较痛苦的。遂决定从H5拖拽的原理开始研究,然后再将其应用...

日期:2018-07-01 14:48:16

点击:205

HTML5中的postMessage API基本使用教程

关于postMessage window.postMessage虽然说是html5的功能,但是支持IE8+,假如你的网站不需要支持IE6和IE7,那么可以使用window.postMessage。关于window.postMessage,很多朋友说他可以支持跨域,不错,window.postMessage是客户端和客户端直接的数据传递,既可以跨域传递,...

日期:2017-06-20 00:27:17

点击:125

关于老式浏览器兼容HTML5和CSS3的问题

下面小编就为大家带来一篇关于老式浏览器兼容HTML5和CSS3的问题。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧 1.让老式浏览器支持HTML5 HTML5能为我们做的事儿很多,最为可口的就是语义化标签的应用,如果你已经在Chrome或者其他...

日期:2017-06-20 00:25:51

点击:176

HTML5中的进度条progress元素简介及兼容性处理

一、progress元素基本了解 1.基本UI progress元素属于HTML5家族,指进度条。IE10+以及其他靠谱浏览器都支持。如下简单code: XML/HTML Code复制内容到剪贴板 1.progresso(︶︿︶)o/progress 是个很带感的进度条吧。有人奇怪:唉~怎么我看到的是个字符表情捏? 恩我只能对你...

日期:2017-06-20 00:24:55

点击:154

HTML5 Canvas渐进填充与透明实现图像的Mask效果

详细解释HTML5Canvas中渐进填充的参数设置与使用,Canvas中透明度的设置与使用,结合渐进填充与透明度支持,实现图像的Mask效果。 一:渐进填充(Gradient Fill) Canvas支持两种渐进填充方式,一种为线性渐进填充(Line Gradient Fill),另外一种称 为经向渐变填充(RadialGr...

日期:2017-06-14 01:07:54

点击:103

html5 input属性使用示例

今天才接确html5 +css3 实在是太赞了。 下面我就来介绍一下今天我用到的 input 属性。 html5 代码如下: 代码如下: input type=text placeholder=输入 回车搜索 autofocus x-webkit-speech / placeholder 默认提示字符 autofocus 当页面加载时,会获得焦点的一个...

日期:2017-06-14 01:07:21

点击:94

仿酷狗html5手机音乐播放器主要部分代码

HTML5作品,经测试,效果确定不错,遗憾的是只支持谷歌和苹果等以webkit核心的浏览器,网友体验的时候请使用谷歌等浏览器来运行,不然的话无法看到效果,不说了,看效果吧 复制代码 代码如下: 主要部分代码如下: function ZzxMusic(){ var aa={}; //模块设置 var setting = {...

日期:2017-06-14 01:06:45

点击:156

HTML5 对各个标签的定义与规定:aside

对aside标签的定义与规定 aside 用来装载非正文类的内容。(DOM接口、可设置属性)。 例如广告,成组的链接,侧边栏等等。 !DOCTYPE html html head meta http-equiv=Content-Type content=text/html; charset=utf-8 / titleHTML5论坛 www.htmlv.cn aside标签示例/tit...

日期:2017-06-14 01:06:13

点击:205

HTML5 对各个标签的定义与规定:body

body元素就是就是html文档的主内容标签。 可设置属性 onafterprint在打印文档之后运行脚本 onbeforeprint在文档打印之前运行脚本 onbeforeonload在文档加载之前运行脚本 onblur当窗口失去焦点时运行脚本 onerror当错误发生时运行脚本 onfocus当窗口获得焦点时...

日期:2017-06-14 01:05:45

点击:65

HTML5 对各个标签的定义与规定:base

base标签除了全局的属性之外,还有 href、target两个属性。 没有内容值。 interface HTMLBaseElement : HTMLElement { attribute DOMString href; attribute DOMString target; }; base标签用于定义HTML文档中的相对url地址的基准URL,和接下来链接的 浏览器 打开...

日期:2017-06-14 01:05:17

点击:121

HTML5 对各个标签的定义与规定:nav

对nav标签的定义与规定 HTML5 中的新元素标签nav用来将具有导航性质的链接划分在一起,使代码结构在语义化方面更加准确,同时对于屏幕阅读器等设备的支持也更好。 一直以来,我们习惯于使用形如div id=nav或ul id=nav这样的代码来写页面的导航;在HTML5中,我们可以直接...

日期:2017-06-14 01:04:24

点击:167

HTML5中对accesskey属性的解释与规定

所有的html元素都可以设置accesskey属性。元素accesskey属性用来设置激活该元素或该元素获取焦点的快捷键。 可以设置多个,用空格间隔,且大小写敏感。...

日期:2017-06-14 01:03:59

点击:167

HTML5 对各个标签的定义与解释:noscript

如果浏览器支持脚本,那么它不会显示出 noscript 元素中的文本。 无法识别 script 标签的浏览器会把标签的内容显示到页面上。为了避免浏览器这样做,您应当在注释标签中隐藏脚本。老式的(无法识别 script 标签的)浏览器会忽略注释,这样就不会把标签的内容写到页面上,...

日期:2017-06-14 01:03:36

点击:121

HTML5 对各个标签的定义与规定:section

section标签是 HTML 5 中的新标签。 W3C定义为: section 标签定义文档中的节(section)。比如章节、页眉、页脚或文档中的其他部分。 section元素标签用来表现普通的文档内容或应用区块。一个section通常由内容及其标题组成...但section元素标签并非一个普通的容器...

日期:2017-06-14 01:03:09

点击:167

HTML5中对class属性的解释与规定

每个元素都可以设置class属性。 如果一个元素属于多个class,用空格隔开,例如a href=http://www.htmlv.cn/html5/a。 设置有class属性值的元素,可以被css中的选择器调用,也可以在DOM中以getElementsByClassName()方法调用。...

日期:2017-06-14 01:02:09

点击:192

28个HTML5特征、窍门和技术

前端的发展如此之迅猛,一不留神,大侠你可能就会被远远地甩在后面了。如果你不想被HTML5的改变/更新搅得不知所措的话,可以把本文的内容作为必须了解的热身课程。 一、新的Doctype //zxx:doctype中文意思指文档类型 仍在使用麻烦的,不可能记得住的XHTML文档类型? !DO...

日期:2017-06-14 01:00:52

点击:70

HTML5中对id属性的定义与规定

此次课程主讲内容是ID元素 id是一个元素的唯一标识,需确保每个元素的id的独一性。 id至少由一个字符组成,且不能包含空字符。 具有不为空id属性的元素,可以在css或DOM的getElementById()方法中方便调用。 不排除一个元素有多个id的可能。 id属性值必须反映该元素...

日期:2017-06-14 01:00:16

点击:144

五大主流浏览器 CSS3 和 HTML5 兼容性大比拼

各大主流浏览器对 CSS3 和HTML5的支持越来越完善,曾经让多少前端开发人员心碎的IE系也开始拥抱标准。就在前几天,W3C的 HTML5 社区领袖 Shelley 宣布,HTML5的开发工作已经接近完成,如果进展顺利,HTML5 将在 2012 年正式成为国际标准。 当然,即使标准正式制定了,现代浏...

日期:2017-06-14 00:58:55

点击:132

HTML5漫谈(2)–HTML5为什么这样红?

HTML5这么红,除了它天生丽质之外,还离不开标准化组织、各大公司及开发者的支持和追捧。 1、技术:天生丽质 HTML5的卖点就两个:第一、跨平台,第二、开发简单。 如果非得短话长说、上纲上线,那我们可以这么说:因为HTML5:代表应用先进生产力的发展要求、代表应用开发技术...

日期:2017-06-14 00:58:00

点击:126

HTML5 对各个标签的定义与规定:header

header标签定义文档的页面组合,通常是一些引导和导航信息(DOM接口、可设置属性)。 header标签定义文档的页眉(介绍信息)。 Header 区的例子包含了页面标题和副标题,header标签被用来创建页面的Header区的内容。除了网页本身之 外,header标签还可以包含关于section和ar...

日期:2017-06-14 00:56:19

点击:141

让 JavaScript 拯救 HTML5 的离线存储

在Inter net 连接无处不在的今天,我们忽然有了另外一个需求,离线 Web。Gmail, Google Reader, Zoho 这些优秀的 Web 应用都支持离线使用,这归功于 Google Gears。然而真正的离线 Web 要靠 HTML 5,这个未来的 Web 语言明星将为 Web 的离线存储制定一套标准,W3C已经发...

日期:2017-06-11 00:56:11

点击:169

HTML 5 正在改变 Web

HTML5是近十年来 Web 标准最巨大的飞跃。和以前的版本不同,HTML 5 并非仅仅用来表示 Web 内容,它的使命是将 Web 带入一个成熟的应用平台,在这个平台上,视频,音频,图象,动画,以及同电脑的交互都被标准化。尽管 HTML 5 的实现还有很长的路要走,但 HTML 5 正在改变 Web。...

日期:2017-06-11 00:55:21

点击:80

HTML5多媒体组件的使用——第三部分:自定义控件

这是关于HTML5的系列教程的第三部分(共3部分)。在第一部分和第二部分,讲到了video和audio元素,简短的展示了如何给这些元素添加controls属性,以此来给浏览器的媒体(media)元素设置默认值。如果已试过,那应该注意到了各个浏览器的默认外观并不一样。 如果你希望你的媒体...

日期:2017-06-11 00:54:37

点击:119

html5实现自己网站的图片假水印功能

--------Web.config---------------- configuration system.web compilation debug=true targetFramework=4.0 / httpHandlers add verb=* path=images/*.jpg type=模块与处理程序.ImageDeal/ /httpHandlers /system.web /configuration -------------ImageDea...

日期:2017-06-11 00:53:51

点击:69

HTML5中的标记方法

1.内容类型(ContentType) DOCTYPE声明是HTML文件中必不可少的,它位于文件的第一行。在HTML 4中,它的声明方法如下: !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd 在HTML 5中,不需要使用版...

日期:2017-06-11 00:53:20

点击:138

全方位了解HTML5

随着web技术的发展,HTML 标准自1999年12月发布的 HTML 4.01 后,后继的 HTML 5 和其它标准被束之高阁,为了推动web标准化运动的发展,一些公司联合起来,成立了一个叫做 Web Hypertext Application Technology Working Group (Web 超文本应用技术工作组 - WHATWG) 的组织...

日期:2017-06-11 00:50:07

点击:197

HTML5新增标签和属性简介

HTML5以进入实际应用,它的强大之处早有耳闻,下面来看一下html5中的新标签和属性。 HTML5中的新标签: article :定义article aside:定义页面内容之外的内容 audio:定义声音内容 canvas:定义图形 command:定义命令按钮 datalist:定义列表 datails:定义元素的细节 emb...

日期:2017-06-11 00:49:19

点击:107

HTML5 对各个标签的定义与规定:article

article 标签装载显示一个独立的文章内容。 例如一篇完整的论坛帖子,一则网站新闻,一篇博客文章等等,一个用户评论等等 artilce可以嵌套,则内层的artilce对外层的article标签有隶属的关系。 例如,一个博客文章,可以用article显示,然后一些评论可以以article的形式嵌入...

日期:2017-06-11 00:48:49

点击:167

HTML5 对各个标签的定义与规定:script

script 标签用于定义客户端脚本,比如 JavaScript。 除全局属性之外有如下属性 src 定义指向包含脚本的文件的 URL(这样您就可以引用某个包含脚本的文件,而不是直接把脚本插入您的 HTML 文档中) async 定义脚本是否异步执行。 defer 指示脚本不会生成任何文档内容。...

日期:2017-06-11 00:48:15

点击:198

用HTML5制作网页

1. HTML 5有什么不同? 2. 最终,一个任何人都可以记住的文档类型 3. 最基本的语义结构 1. header 2. nav 3. section 1. article 2. aside 3. footer 4. 把他们放在一起 5. 为新元素编写样式 6. 兼容老的 浏览器 7. 现在你可以使用HTML 5了,但你会用么? HTML 5有什...

日期:2017-06-11 00:21:17

点击:174

html5 canvas常用api总结(一)

1.监听浏览器加载事件。 window.addEventListener(load,eventWindowLoaded,false); load事件在html页面加载结束时发生。 第三个参数设置函数是否在事件传递到DOM对象树的底层对象之前捕捉此种类型的事件。 2.引入canvas方法 canvas id=fcanvas width=500 heig...

日期:2017-04-09 22:53:58

点击:216

HTML5拖拉上传文件的简单实例

在HTML5的pc上面实现了相当多的功能,工作中也用到了拖拉上传,特地记录下该功能 在拖动目标上触发事件 (源元素): ondragstart - 用户开始拖动元素时触发 ondrag - 元素正在拖动时触发 ondragend - 用户完成元素拖动后触发 释放目标时触发的事件: ondragenter -...

日期:2017-04-09 22:53:29

点击:226

详解HTML5中表单验证的8种方法介绍

在深人探讨表单验证之前,让我们先思考一下表单验证的真实含义。就其核心而言,表单验证是一套系统,它为终端用户检测无效的控件数据并标记这些错误。换言之,表单验证就是在表单提交服务器前对其进行一系列的检查并通知用户纠正错误。 但是真正的表单验证是什么? 是一...

日期:2017-04-09 22:52:56

点击:108

IE不支持HTML5表单属性placeholder的解决办法

IE,HTML5,表单,placeholder,具体代码如下: (function ($) { $.fn.placeholder = function (options) { var defaults = { pColor: #ccc, pActive: #999, pFont: 14px, activeBorder: #080, posL: 8, zIndex: 99 }, opts = $.extend(defaults, options); // retur...

日期:2017-02-11 21:30:05

点击:176

HTML5帮助你开发类似本地移动应用的前端框架Junior

Junior 是一款使用HTML5技术的前端框架,可以帮助你创建类似本地应用开发风格的移动前端应用。 使用CSS3生成平滑的过渡效果,可以让页面看上去更具有灵活性,它支持触摸操作,并且也包括支持各种不同的UI组件。 整个框架使用Zepto( 类似jQuery语法的轻量级移动设备js类...

日期:2017-02-11 20:36:06

点击:97

html5进度条实现代码

html5进度条的实例代码,HTML5实现有特色的进度条效果,需要支持HTML5的浏览器下查看效果,相比js等实现的进度条,有哪些不同? 完整代码: 代码示例: !DOCTYPE html html head meta charset=UTF-8 titlehtml5有特色的进度条 - www.my398.com/title base tar...

日期:2017-01-22 22:37:32

点击:57

HTML5怎么关闭所有HTML元素

在 HTML5 中, 你不一定要关闭所有元素 (例如 p 元素),但我们建议每个元素都要添加关闭标签。 不推荐: section p 这是一个段落。 p 这是一个段落。 /section 推荐: section p 这是一个段落。 /p p 这是一个段落。 /p /section 关闭空的 HTML 元素 在 HTML5...

日期:2017-01-22 22:16:19

点击:112

HTML5 内联 SVG

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

日期:2017-01-22 22:15:45

点击:169