![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
HTML5
xueshijun666
这个作者很懒,什么都没留下…
展开
-
6.HTML5 Canvas 绘图-2
var canvas;var context;window.onload = function() { canvas = document.getElementById("drawingCanvas"); context = canvas.getContext("2d"); canvas.onmousedown = startDrawing; canvas.onmous原创 2013-12-29 01:28:28 · 560 阅读 · 0 评论 -
8.HTML5 CSS3大小、定位、轮廓相关属性
1.大小相关属性1.1 CSS3新增的box-sizing属性box-sizing: content-box;-moz-box-sizing: content-box;box-sizing: padding-box;-moz-box-sizing: padding-box;box-sizing: border-box;-moz-box-sizing: b原创 2014-01-08 21:36:15 · 511 阅读 · 0 评论 -
3.HTML5标准
一、标准1.ARIP(Accessible Rich Internet Application)2.RDFa(Resource Description Framework)3.Microformats hCardhttp://microformats.org/wiki/hcard Sally Ride原创 2013-12-25 16:10:17 · 493 阅读 · 0 评论 -
5.HTML5 音频和视频-1
不支持HTML5看到的内容. 不支持HTML5看到的内容. 浏览器不支持.原创 2013-12-26 00:04:40 · 529 阅读 · 0 评论 -
5.HTML5 音频和视频-2 (自定义播放器)
var video; var display; window.onload = function() { video = document.getElementById("videoPlayer"); display = document.getElementById("displayStatus"); video.onplaying = function() {原创 2013-12-26 22:59:34 · 600 阅读 · 0 评论 -
8.HTML5 CSS3盒模型和布局相关属性
1.布局相关1.1 使用clear属性实现换行1.2 使用clip属性控制裁剪 rect(16px 400px auto 30px); rect(24px 480px auto 60px); rect(36px 520px auto 90px); rect(36px auto auto 120px); rect(A,B,C,D)原创 2014-01-09 00:18:06 · 2078 阅读 · 0 评论 -
8.HTML5 表格、列表相关属性及media query
1. 表格border-collapse:设置表格里行和单元格边框的显示方式。seperate:边框分开。collapse:边框合并。 border-spacing:当设置border-collapse:seperate时,设置两个单元格边框之间的间距。 caption-side:表哥标题位于表格的哪边。该属性必须跟元素一起使用。原创 2014-01-12 06:28:24 · 698 阅读 · 0 评论 -
8.HTML5 CSS3 变形与动画相关属性
1. CSS3提供的对变形的支持transformtranslate(tx,[ty])translateX(tx):横向上位移translateY(ty):纵向上位移scale(sx,[sy]):缩放scaleX(sx)scaleY(sy)rotate(angle):顺时针旋转skew(sx,[sy]):沿着X,Y轴倾原创 2014-01-12 12:49:53 · 850 阅读 · 0 评论 -
9.HTML5 javascript
1.类型转换值目标字符串数值布尔对象undefined"undefined"NaNfalseErrornull"null"0falseError字符串字符串数值或NaNtrueString对象空字符串空字符串0falseStri原创 2014-01-14 00:00:43 · 568 阅读 · 0 评论 -
11.HTML5 JavaScript DOM
1. DOM事件模型在进行js编程时,需要考虑两种编程模型:IE模型DOM模型,行业规范。1.1 绑定事件处理1.1.1 IE模型:objTarget.attachEvent("eventType" , handler); 1.1.2 DOM提供的事件绑定方法:objTarget.addEventListener("eventType",h原创 2014-02-12 16:15:59 · 802 阅读 · 0 评论 -
8.HTML5 CSS3 背景、边框与补丁相关属性
1.背景相关1.1 背景图片固定 background-attachment:fixed">1.2 CSS3 新增的背景相关属性background-clip:该属性用于设置背景覆盖的范围。border-box:背景覆盖边框区、内补丁区、内容区。no-clip:背景覆盖边框区、内部补丁区、内容区。padding-box:指定背景覆盖内部补丁区、内容区。con原创 2014-01-08 00:03:13 · 897 阅读 · 0 评论 -
6.HTML5特效
一、图新特效处理1.使用坐标变换 // 获取canvas元素对应的DOM对象 var canvas = document.getElementById('mc'); // 获取在canvas上绘图的CanvasRenderingContext2D对象 var ctx = canvas.getContext('2d'); ctx.fillStyle = "rgba(255, 0原创 2014-01-05 20:03:11 · 466 阅读 · 0 评论 -
7.HTML5 高级Canvas技术-1
window.onload = function() { var canvas = document.getElementById("croppedPicCanvas"); var context = canvas.getContext("2d"); //****绘制图片**/ var img = document.getElementById("sourcePic原创 2013-12-31 01:00:11 · 825 阅读 · 0 评论 -
7.HTML5 高级Canvas技术-基本动画
var canvas; var context; window.onload=function(){ canvas=document.getElementById("drawingCanvas"); context=canvas.getContext("2d"); drawFrame(); }; var squareX=0; va原创 2014-01-01 12:26:43 · 511 阅读 · 0 评论 -
7.HTML5 高级Canvas技术-2
var context; var canvas; var circles = []; var selectCircle; window.onload = function() { canvas = document.getElementById("drawingCanvas"); context = canvas.getContext("2d");原创 2013-12-31 04:35:45 · 657 阅读 · 0 评论 -
1.HTML5简介
1.查看浏览器支持情况caniuse.com2.检测浏览器支持http://modernizr.com/download/#-applicationcache-canvas-canvastext-draganddrop-hashchange-history-audio-video-indexeddb-input-inputtypes-localstorage-postmessage-s原创 2013-12-22 22:51:47 · 688 阅读 · 0 评论 -
2.HTML5常用元素和属性
1.查看纲要1.1 Chrome扩展http://code.google.com/p/h5o/1.2 在线HTML纲要生成器http://gsnedders.html5.org/outliner/1.3 Opera扩展https://addons.opera.com/zh-cn/extensions/details/html5-outliner/?display原创 2013-12-25 14:20:45 · 1741 阅读 · 0 评论 -
4.HTML5 Web表单
Contact Details Name * Telephone Email * What's Your Favorite Animal? Pi原创 2013-12-25 23:18:17 · 680 阅读 · 0 评论 -
6.HTML5基本Canvas 绘图
window.onload=function(){ var canvas=document.getElementById("drawCanvas"); var context=canvas.getContext("2d"); context.lineWidth=10; context.strokeStyle = "red"; //context.strokeS原创 2013-12-29 00:46:56 · 774 阅读 · 0 评论 -
8.HTML5 CSS3
一、CSS样式的基本使用1.引入外部样式文件2.导入外部样式文件@import "outer.css";二、CSS选择器1.元素选择器div{ background-color: grey; font: italic normal bold 14pt normal 楷体_GB2312; }2.属性选择器 /* 对有id属性的div元素起原创 2014-01-05 21:51:58 · 527 阅读 · 0 评论 -
8.HTML5 CSS3 字体与文本相关属性
1.字体相关属性color:#888888: 测试文字color:red: 测试文字font-family:楷体_GB2312: 测试文字font-size:20pt: 测试文字font-size:xx-large: 测试文字font-stretch:narrower: 测试文字font-stretch:wider : 测试文字font-style:italic:原创 2014-01-05 22:40:32 · 804 阅读 · 0 评论 -
12.本地存储和离线应用
1.WebStorsgeCookie的不足:Cookie的大小被限制了;Cookie包含在每个HTTP请求中向服务器发送,导致多次发送重复数据。Cookie在网络传输时并未加密(除非整个应用都是用SSL)1.1 Storage接口2.离线应用原创 2014-02-13 00:04:07 · 941 阅读 · 0 评论