一、忏悔 之前HTML没有好好学，导致以前看到控件组样式感觉很新奇，于是就用css实现了一个。但是偶然一次接触了这个标签，才发现so easy。唉！以后学知识不要浅尝辄止，一定要深入进去、全面了解。好了，不喷了，算是自己写给自己的吧，做个警醒。开始学习这个标签了。 二、简述 标签将表单内容的一部分打包，生成一组相关表单的字段。从中提取两层意思：1.fieldset存在于form里(这样说不准确)；2.分组打包的功能。 field:[fi?ld]...
前言 今天Web应用程序已经很复杂了，以现在的发展，会将越来越复杂，但他有一个致命缺点，不能脱离internet链接，因此在HTML中新增了一API， 它使用一个本地存储机制很好地解决了这个问题，为离线web应用铺平了道路。本地缓存于浏览器缓存代码如下:本地缓存是为整个web应用程序服务浏览器缓存只对单个网页服务 任何网页都具有网页缓存本地缓存只缓存那些你指定缓存的页面 网页缓存不可靠、不安全，因为我们不知道网站中到底缓存了哪...
首先来了解一下windows 8 的贴靠，在windows 8 中的Metro应用可以将屏幕很好的进行分割.如下图让用户在使用时可以非常方便的切换。 系统对贴靠也是有硬性规定的。最多两个屏幕，而且是一个大的一个小的。并且小屏的宽度是固定的 320像素。 所以当用户把网站贴成小屏幕，这个时候页面默认是等比例缩小的。如下图:那么怎么很好的解决这样的一个问题呢？让网站在windows 8的贴靠小屏幕下显示非常友好的效果呢？下面我有一个简单的示例...
首先要说明的是这里不是用鼠标画画，而是在触摸设备上用手指，比如ipad。 做画图板，自然使用html5的canvas来实现了。在canvas中我们可以画圆，画矩形，画自定义的线条等等。这次主要使用的画圆跟画线条来实现。html中支持对触摸事件的响应。 onTouchStart 触摸开始 onTouchMove 触摸滑动 onTouchEnd 触摸结束 有了这些事件，我们实现用手指在浏览器里画画就很简单了。 IPAD上的效果：思路：当手指触摸到屏幕的时候在onTouchStart ...
HTML5 Canvas动画效果演示 主要思想： 首先要准备一张有连续帧的图片，然后利用HTML5 Canvas的draw方法在不同的时间间隔绘制不同的帧，这样看起来就像动画在播放。 关键技术点： JavaScript 函数setTimeout()有两个参数，第一个是参数可以传递一个JavaScript方法， 另外一个参数代表间隔时间，单位为毫秒数。代码示例： setTimeout( update, 1000/30); Canvas的API-drawImage()方法，需要指定全部9个参数： ctx.drawImage(myImage,...
HTML中与form有关的东东 新增属性个人理解formhtml5之前，表单内的从属元素需要放入标签中，现在可以为标签指定form标签即可点评：该功能解决了我们实际中遇到的一些问题，比如iframe模拟异步图片上传时，就必须将图片写到form外。formactionformmethod该属性用于按钮（submit）让表单提交页面可又按钮控制formmethod指定各按钮提交方式placehoder该属性非常有用，用于文本框中显示提示信息，非常有用的一属性listlist属性需要与da...
定义和用法 标签定义嵌入的内容，比如插件。 实例 HTML 4.01 与 HTML 5 之间的差异 标签是 HTML 5 中的新标签。 属性 new : HTML5 中的新属性。 属性 值 描述 height pixels 设置嵌入内容的高度。 src url 嵌入内容的 URL。 type type 定义嵌入内容的类型。 width pixels 设置嵌入内容的宽度。 这里说它是 HTML 5 中的新标签，其实它在HTML4中早已见怪不怪了。 为什么说它是个鸡肋呢？ 那是因为src属性的值必须指定实际的文件扩...
学习几天HTML5了，之前一直在看文档，没有动手写，昨晚开始写代码，发现中文显示乱码，之前以为是不兼容IE10、然后换成火狐，谁知也不行，最后折腾一番，原来在编辑网页的时候，不仅仅是添加这一句，在的文件在保存时，也要保存为UTF-8，就可以了。代码如下：代码如下: 第一个HTML5 Your browser does not support the video tag. 这是是乱吗？
HTML5 Canvas中提供了设置阴影的四个属性值分别为： context.shadowColor = “red” 表示设置阴影颜色为红色 context.shadowOffsetX = 0表示阴影相对TEXT的水平距离，0表示两者水平位置重合 context.shadowOffsetY = 0表示阴影相对TEXT的垂直距离，0表示两者垂直位置重合 context.shadowBlur = 10 阴影模糊效果，值越大模糊越厉害。 一个最简单的带有阴影的矩形代码如下： context.shadowColor = "RGBA(127,127,127,1)";...
代码如下: HTML5的标题 HTML5的内容！Hello 用记事本写，保存后在网页上运行出现了乱码，换成GB2312能正确显示中文 代码没有问题，问题就出记事本身上。 只是告诉浏览器要用utf-8来解释，而文档的编码，是在你保存时的选择决定的，如果保存ANSI 然后用utf-8解释，肯定是乱码，记事本的话，默认保存的文件格式是ANSI，所以在保存的时候要修改为uif-8。
这两天需要用到同事HTML5画图的东东，发现里面画矩形的函数画出来的边框出现了样式不一致的问题，最后我通过一些排除法找到了问题的症结，现分享给大家。 先附上HTML5画矩形的的代码：代码如下: var canvas = document.getElementById('myCanvas'); var context = canvas.getContext('2d'); context.beginPath(); context.rect(188.0, 50, 200, 100.375); context.fillStyle = 'white'; context.fill(); ...
viewport 语法介绍： 代码如下:content=”height = [pixel_value | device-height] ,width = [pixel_value | device-width ] ,initial-scale = float_value ,minimum-scale = float_value ,maximum-scale = float_value ,user-scalable = [yes | no] ,target-densitydpi = [dpi_value | device-dpi | high-dpi | medium-dpi | low-dpi]”/> 参数解释： width—-控制 viewport 的大小，可以指定的一个值或者特殊的值，如 device-wid...
Ajax局部刷新可以通过HTML5的新特性修改browser address。 window.history表示window对象的历史记录 window.history.pushState(object, title, new_url) -- 在window.history里新增一个历史记录点 window.history.replaceState(object, title, new_url) -- 在window.history替换当前page的历史记录点 object - 可以扩展想要的object title - 目前所有浏览器都不支持 new_url 浏览器不会检查url是否存在，只改变url，url必须同域，不...
我们先看下他们的不同显示。下面是在火狐下的截图： 下面这个是在chrome下的截图： 能猜想到的，就是写的代码肯定是不兼容的。不过你会发现真是比较简单的，就算你是前端初学者你也会明白代码如下:其中参数的意义：x-webkit-speech：就是让你的输入框的右边出现一个小话筒，有了语音的功能。lang：则是 强制输入框里面的语音的语言种类，例如上面写的 lang="zh-CN"指的是简体中文。x-webkit-grammar：指的是语音输入语法，"builtin...
如今HTML5愈来愈引发大家的关注了，但目前支持HTML5的浏览器还不是主流，特别是国内用户近50%以上仍旧使用IE6，由于支持HTML5的IE9不支持Xp系统安装，这样未来很长一段时间，HTML5的开发者将必须考虑向下兼容的问题。HTML5的标签或CSS选择器兼容性的做法有很多，其中自己生成标签元素就是一种。 基本原理参见如下代码在IE8中效果，样式根本没有起作用。 代码如下:mxria{ color: red; }Hello! 为了是浏览器识别标签并显示对应样式的...