一.HTML新增标签
1.布局语义化标签
article:标签装载显示一个独立的文章内容,例如一篇文章,报道,小说
selection:标签用来 定义文档中的节,例如一个小说的一章节
aside:用来加载非正文类的内容,对于主题内容的说明
header:标签用来定义非正文内容,对于主题内容的说明
footer:标签定义页脚
nav:标签定义导航条链接
mark:在需要突出的地方进行标记
details:标签用于描述文档或文档某个部分的细节,而这个细节并不需要文档加载时就展示,而是可以折叠。
summary:默认显示的details 元素的标题。
prograss:标签定义运行中的进度(进程)。
datalist:标签定义选项列表。请与 input 元素配合使用该元素,来定义 input 可能的值。
keygen:标签规定用于表单的密钥对生成器字段。当提交表单时,私钥存储在本地,公钥发送到服务器。
2.新增表单输入类型
url
number(min,max step,value)
range
search
color
Data
3.新增表单属性
placeholder提示框信息
autofocus:输入焦点
require:必须填写字段
pattern:正则验证
checkValidity显示验证法
二:video和audio元素的属性和方法
1.标签:
视频
:音频标签
2.属性:
src :引用文件路径
autoplay:自动播放
preload 默认属性auto 预先加载媒体文件
poster 视频的独有属性 播放前展示一张图片 width 宽 height 高
loop 自动重新播放
controls 用户界面展示
error 返回错误
played 获取播放时的时间段
paused 暂停 获取暂停时的 boolean值
ended 获取结束时的boolean值
volumn 控制声音大小
muted 静音控制
3.方法
Play() :播放
pause() :暂停
load() :重新加载
4.事件
ontimeupdate :音频/视频播放中事件
onended :音频/视频结束时事件
三.canvas画布
1.: 画布标签
2.属性
width 宽 height 高
strokeRect 方法绘制矩形
fillRect 方法绘制“已填色”的矩形
clearRect() 方法清空给定矩形内的指定像素
fillStyle 属性设置或返回用于填充绘画的颜色、渐变或模式
strokeStyle 属性设置或返回用于笔触的颜色、渐变或模式
moveTo(x,y) 定义线条开始坐标
lineTo(x,y) 定义线条结束坐标
beginPath() 开始一条路径
closePath() 创建从当前点到开始点的路径
arc() 方法创建弧/曲线(用于创建圆或部分圆)
arc(x,y,r,sAngle,eAngle,counterclockwise);['greɪdɪənt]createLinearGradients()
创建渐变对象 createLinearGradients(,x1,y1);
createRadialGradient()
创建放射式渐变对象 createRadialGradient(x,y,r,x1,y1,r1);
addColorStop() 起始颜色
addColorStop(i,colors);
drawImage(img,x,y) 给画布插入图片
drawImage(img,x,y,width,height) 给插入画布的图片设置宽高