HTML5

一.HTML新增标签

1.布局语义化标签

article:标签装载显示一个独立的文章内容,例如一篇文章,报道,小说

selection:标签用来 定义文档中的节,例如一个小说的一章节

aside:用来加载非正文类的内容,对于主题内容的说明

header:标签用来定义非正文内容,对于主题内容的说明

footer:标签定义页脚

nav:标签定义导航条链接

mark:在需要突出的地方进行标记

details:标签用于描述文档或文档某个部分的细节,而这个细节并不需要文档加载时就展示,而是可以折叠。

summary:默认显示的details 元素的标题。

prograss:标签定义运行中的进度(进程)。

datalist:标签定义选项列表。请与 input 元素配合使用该元素,来定义 input 可能的值。

keygen:标签规定用于表单的密钥对生成器字段。当提交表单时,私钥存储在本地,公钥发送到服务器。


2.新增表单输入类型

email

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) 给插入画布的图片设置宽高

你可能感兴趣的:(HTML5)