美文网首页
多媒体标签

多媒体标签

作者: Strive_12c4 | 来源:发表于2017-03-06 22:46 被阅读0次

video标签

作用: 播放视频

格式1:<video src=" "></video>

video标签的属性:

src: 告诉video标签需要播放的视频地址

autoplay: 告诉video标签是否需要自动播放视频

controls: 告诉video标签是否需要显示控制条

poster: 告诉video标签视频没有播放之前显示的占位图片

loop: 告诉video标签循环播放视频. 一般用于做广告视频

preload: 告诉video标签预加载视频, 但是需要注意preload和autoplay相冲, 如果设置了autoplay属性, 那么preload属性就会失效

muted:告诉video标签视频静音

width/height: 和img标签中的一模一样


格式2:

<video>

       <source src=" " type=" "></source>

       <source src=" " type=" "></source>

</video>

第二种格式存在的意义

1.由于视频数据非常非常的重要, 所以五大浏览器厂商都不愿意支持别人的视频格式, 所以导致了没有一种视频格式是所有浏览器都支持的这个时候W3C为了解决这个问题, 所以推出了第二个video标签的格式

2.video标签的第二种格式存在的意义就是为了解决浏览器适配问题. video 元素支持三种视频格式, 我们可以把这三种格式都通过source标签指定给video标签, 那么以后当浏览器播放视频时它就会从这三种中选择一种自己支持的格式来播放


注意点:

1.当前通过video标签的第二种格式虽然能够指定所有浏览器都支持的视频格式, 但是想让所有浏览器都通过video标签播放视频还有一个前提条件, 就是浏览器必须支持HTML5标签, 否则同样无法播放

2.在过去的一些浏览器是不支持HTML5标签的, 所以为了让过去的一些浏览器也能够通过video标签来播放视频, 那么我们以后可以通过一个JS的框架叫做html5media来实现


audio标签

作用: 播放音频

格式1:<audio src=" "></audio>

格式2:

<audio>

         <source src=" " type=" ">

</audio>

注意点:    - audio标签的使用和video标签的使用基本一样, video中能够使用的属性在audio标签中大部分都能够使用, 并且功能都一样. 只不过有3个属性不能用, height/width/poster

marquee标签

作用: 跑马灯效果

格式:<marquee>内容</maquee>

属性:

1.direction: 设置滚动方向 left/right/up/down

2.scrollamount: 设置滚动速度, 值越大就越快

3.loop: 设置滚动次数, 默认是-1, 也就是无限滚动

4.behavior: 设置滚动类型 slide滚动到边界就停止, alternate滚动到边界就弹回

注意点:

marquee标签不是W3C推荐的标签, 在W3C官方文档中也无法查询这个标签, 但是各大浏览器对这个标签的支持非常好

HTML中被废弃的标签

-- 由于HTML现在只负责语义而不负责样式.但是HTML一开始有一部分标签连样式也包揽了, 所以这部分标签都被废弃了

-b、u、i、s-以上标签自己带有样式, 有浓厚的样式作用, 今后一般都只作为CSS钩子使用-原则: 不到万不得已,切记不要使用如上标签. 大家可以到BAT的网站查看源代码, 几乎看不到以上标签

b(Bold)作用: 将文本字体加粗

格式:<b>将文本字体加粗</b>

u(Underlined)作用: 为文本添加下划线

格式:<u>为文本添加下划线</u>

i(Italic)作用: 显示斜体文本效果

格式:<i>显示斜体文本效果</i>

s(Strikethrough)作用: 为文本添加删除线

格式:<s>为文本添加删除线</s>

为了弥补 b、u、i、s标签的不足, W3C又推出了一组新的标签, 这些标签在显示上看似和b、u、i、s没什么区别,但是在语义上却有重大区别

strong作用: 着重内容

格式:<strong>着重内容</strong>

ins(Inserted)作用: 新插入的文本

格式:<ins>新插入文本</ins>

em(Emphasized)作用:强调内容

格式:<em>强调内容</em>

del(Deleted)作用: 已删除的文本

格式:<del>已删除文本</del>


HTML字符实体

我们想在页面上输出<h1>这些字符,但是HTML认为这是一个标签, 所以如果需要输出一些特殊的字符需要通过字符实体来实现

lt是英语less than 小于的意思,<可以在页面上输出一个小于符号;gt是英语greater than 大于的意思,>可以在页面上输出一个大于符号

html中对空格,缩进,换行不敏感,如果同时出现多个空格缩进或者执行,页面只会把它们当作一个空格来解析。所以想要在html中输出空格必须使用&nbsp;来实现, 一个&nbsp;就代表一个空格

&copy;是版权符号,,还有更多的在w3school里面查询

相关文章

  • CSS3新增1

    一、HTML5 新增标签 新增语义化标签 使用语义化标签的注意 二、多媒体音频标签 多媒体标签有两个,分别是 音频...

  • 多媒体标签

    video标签 作用: 播放视频 格式1: video标签的属性: src: 告诉video标签需要播放的视频地址...

  • 多媒体标签

    video标签 作用:播放视频 格式: video标签的属性src: 告诉video标签需要播放的视频地址auto...

  • 多媒体标签

    https://www.jianshu.com/p/a310662ed188

  • 标签4(多媒体标签)

    video标签 作用:播放视频 格式一: 格式二: 视频格式:1.video/wobm, ...

  • ## HTML基础-多媒体标签

    ## HTML基础-多媒体标签 # video标签 # audio标签 # marquee标签(跑马灯) H5新增...

  • html5新增与废除的标签

    新增标签 结构标签(块状元素)---有意义的div 多媒体标签 其他标签 废除的标签

  • HTML多媒体

    今天学习了HTML传统的多媒体标签 和 标签。HTML多媒体主要包含视频、音频、动画等,在HTML中要插入这些...

  • CSS3之一

    多媒体 iframe标签 第三方视频网站引入 多媒体标签 audio video 结构伪类选择器 first-ch...

  • HTML5新特性

    1、语义化标签 header,nav,article,section,aside,foooter标签。 2、多媒体...

网友评论

      本文标题:多媒体标签

      本文链接:https://www.haomeiwen.com/subject/gcqpgttx.html