HTML5部分新标签

HTML5部分新标签

语义化标签

  1. header 表示头部-块元素

  2. section -区块

  3. footer --底部

  4. nav -导航链接

  5. aside -侧边栏

  6. article -内容区域

  7. output - 输出 用于存放计算总价的时候,将总价放在这个标签

  8. canvas -专业画画的标签

表单标签和表单属性

  1. 表单域

  2. fieldset:表单集合标签,一般用于把表单中的几个元素包裹在一起,一起控制

    1. disabled 禁用

    2. legend 标题

    姓名:

  3. 新表单类型

    1. type="email" 要有@符号

    2. typr="url". 要有协议

    3. type="number" 只能输入数字和小写字母e

    1. type="tel"

    2. type="search". 在输入内容的过程中,会出现清空按钮

    3. type="date" 年月日的日期控件

    4. type="time" 时分秒的空间

    5. type="month" 选择月份的控件

    6. type="week" 显示这是这一年的第几周

    7. type="range" 进度条

    设置最大进度,最小进度和 value表示当前进度

    1. type="color" 颜色选择器

    其他的form属性

    1. placeholder

    2. required 表示必填,空的时候不能提交

    3. autocomplete. 记录表单提交过的数据

      on --开启记录功能,当下次再输入的时候会有一个智能提示

      off--关闭记录功能

      这个属性要添加在form上,表单要有name属性

    4. pattern属性,值是一个正则表达式,用来校验当前表单元素的属性

    5. multipe 用于type=file的文件选择器上,用于选择多个文件,默认只能选择一个

    6. datalist可输入内容的下拉框,将datalist的id值,跟input的list属性的值保持一致,将需要下拉显示的option放在datalist标签中,option必须要有value属性和值




    7. 下拉框添加multiple属性可以让下拉框进行多选

      将多个option放在一个outgroup的标签中,可以对进行分组

    8. 表单之外的表单元素,如果需要在表单提交的时候,也需要进行提交,就可以给表单设置id属性,给外面的表单元素设置form属性,两个值保持一致

    9. formaction 给一个表单设置不同的提交地址

    10. formmethod 给一个表单设置不同的提交方式

video

浏览器对于video的格式兼容不好,以上为兼容写法

loop为循环播放

controls属性,会出现默认的控制面板

autoplay自动播放,在某些情况下是不好用的

width和height属性用来设置宽和高

如果设置了一个,另一个会等比例缩放

如果两个都设置了

audio标签

只接收ogg和mp3两种格式,使用方式和video是一样的

在不写controls时是不占空间的,写了controls时控制面板时行内元素

多媒体的API

  1. play() 播放

  2. pause() 暂停

  3. duration()获取多媒体的播放时长。以秒为单位

  4. muted 获取/设置多媒体的静音属性

    console.log(vedio.muted);

    vedio.muted=true

vedio.play() //正常情况下是不允许播放的,需要先静音才能播放

  1. volume 获取/设置音量,0-1

  2. currentTime获取/设置当前多媒体播放的时间

  3. paused 获取多媒体是否暂停

  4. playbackRate 获取/设置多媒体播放的倍速--倍数

多媒体的事件

  1. loadstart:视频开始加载的时候触发

  2. progress:浏览器正在下载多媒体的时候触发--相当于在加载

  3. canplay:加载完毕,能播放了的时候触发

  4. play:多媒体开始播放的时候

  5. pause:多媒体暂停的时候触发

  6. seeking:当多媒体即将跳到新位置的时候会触发

  7. seeked:已经跳转到新位置了

  8. waiting:当多媒体正在等待缓存的时候触发

  9. timeupdate:只要播放时间改了就会触发,相当于时时都会触发

  10. ended:视频播放结束的时候会触发

  11. error:播放错误的时候会触发

  12. volumechange:音量发生改变的时候会触发

  13. ratechange:播放速度更改的时候会触发

你可能感兴趣的:(HTML5部分新标签)