HTML5
关注
分享
扫一扫
qq_44753552
这个作者很懒，什么都没留下…
展开
-
H5学习笔记（九）--其他新增标签
目录1、状态标签2、列表标签3、注释标签4、标记标签5、疯狂的表单6、新增表单控件7、新增表单属性8、表单验证反馈9、关闭验证1、状态标签meter:用来显示已知范围的标量值或者分数值。 value:当前的数值。 min:值域的最小边界值。如果设置了，它必须比最大值要小。如果没设置，默认为0 max:值域的上限边界值。如果设置了，它必须比最小值要大。如果没设置，默认为1 low:定义了低值区间的上限值,如果设置了，它必须比最小值属性大，并且不能超过high值和最大值。未设置或者比最小值还要小时，原创 2020-09-16 20:49:26 · 240 阅读 · 0 评论 -
H5学习笔记（八）--音视频
目录1、html5音视频标签2、video标签的属性3、audio标签的属性4、音视频js相关属性5、音视频js相关函数6、js相关事件（addEventListener)1、html5音视频标签<video>:Html5提供的播放视频的标签 src:资源地址 controls:该属性定义是显示还是隐藏用户控制界面 <audio>:Html5提供的播放音频的标签 src:资源地址 controls:该属性定义是显示还是隐藏用户控制界面 <source>原创 2020-09-16 20:37:55 · 383 阅读 · 0 评论 -
H5学习笔记（七）--canvas总结
1.注意点 ---canvas图像的渲染有别于html图像的渲染， canvas的渲染极快，不会出现代码覆盖后延迟渲染的问题 写canvas代码一定要具有同步思想 ---在获取上下文时，一定要先判断 ---画布高宽的问题 画布默认高宽300*150 切记一定要使用html的attribute的形式来定义画布的宽高 通过css形式定义会缩放画布内的图像 ---绘制矩形的问题 a.边框宽度的问题，边框宽度是在偏移量上下分别渲染一半，可能会出现小数边框， 一旦出现小数边框原创 2020-09-14 20:45:25 · 116 阅读 · 0 评论 -
H5学习笔记（六）--canvas像素、合成和事件
目录像素操作在canvas中的像素操作操作单个像素（行与列）马赛克合成全局透明度的设置覆盖合成挂挂卡事件将画布导出为图像事件操作像素操作在canvas中的像素操作 到目前为止，我们尚未深入了解Canvas画布真实像素的原理，事实上， 你可以直接通过ImageData对象操纵像素数据，直接读取或将数据数组写入该对象中得到场景像素数据 getImageData():获得一个包含画布场景像素数据的ImageData对像,它代表了画布区域的对象数据 ctx.getImageData(sx, sy, s原创 2020-09-14 20:35:13 · 240 阅读 · 0 评论 -
H5学习笔记（五）--canvas图片、背景和绘制文本
目录使用图片设置背景绘制文本在canvas中绘制文本文本样式measureTextcanvas中文本水平垂直居中阴影(文本阴影&盒模型阴影)使用图片在canvas中插入图片(需要image对象) 1.canvas操作图片时，必须要等图片加载完才能操作 2.drawImage(image, x, y, width, height) 其中 image 是 image 或者 canvas 对象，x 和 y 是其在目标 canvas 里的起始坐标。 这个方法多了2个参数：width 和 he原创 2020-09-14 20:14:44 · 888 阅读 · 0 评论 -
H5学习笔记（四）--canvas钟表实例
在画布上制作一个钟表，显示当前时间。代码：<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title></title> <style type="text/css"> * { margin: 0; padding: 0; } html, body { height: 100%; overflow: hidden;原创 2020-09-14 19:53:58 · 128 阅读 · 0 评论 -
H5学习笔记（三）--canvas绘制矩形、路径、曲线和变换
目录1、绘制矩形笔记：实例2、绘制路径笔记：实例3、绘制曲线canvas绘制圆形canvas绘制圆弧二次贝塞尔三次贝塞尔1、绘制矩形笔记：HTML中的元素canvas只支持一种原生的图形绘制：矩形。所有其他 的图形的绘制都至少需要生成一条路径1.绘制矩形 canvas提供了三种方法绘制矩形： ---->绘制一个填充的矩形（填充色默认为黑色） fillRect(x, y, width, height) ---->绘制一个矩形的边框（默认边框为:一像素实心黑色）原创 2020-09-14 18:32:08 · 1412 阅读 · 0 评论 -
H5学习笔记（二）--canvas基本用法
1、canvas基本用法概述1.什么是canvas(画布) <canvas> 是 HTML5 新增的元素，可用于通过使用JavaScript中的脚本来绘制图形 例如，它可以用于绘制图形，创建动画。<canvas> 最早由Apple引入WebKit 我们可以使用<canvas>标签来定义一个canvas元素 ----->使用<canvas>标签时，建议要成对出现，不要使用闭合的形式。 ----->canvas元素默认具有高宽原创 2020-09-14 17:43:32 · 266 阅读 · 0 评论 -
H5学习笔记（一）--基础
目录1、HTML5概述2、DOCTYPE3、自定义属性4、可编辑5、语义化标签1、HTML5概述HTML5: HTML5是定义HTML标准的最新版本，该术语标识两个不同的概念： 它是一个新版本的HTML语言，具有新的元素、属性和行为； 它有更大的技术集，允许更多样化、强大的网站和应用程序。 HTML5 约等于 HTML + CSS + JSHTML5的优势： 跨平台:唯一一个通吃PC MAC Iphone Android等主流平台的跨平台语言 快速迭代 降低成本 导流入口多 分发原创 2020-09-14 17:35:09 · 277 阅读 · 0 评论