HTML学习笔记（9）【video、audio、marquee标签】

HTML基础学习

1.1video标签基本使用：

• 作用：用来播放视频
• 格式：

<video src="" autoplay="autoplay" controls="controls" poster="">
</video>

video标签的属性：

• src:用于告诉video标签需要播放的视频地址
• autoplay：用于告诉video标签是否需要自动播放视频
• controls:
  告诉video标签是否需要显示控制条
• poster:
  用于告诉video视频没有播放之前显示的占位图片
• loop:
  用于告诉video标签视频播放完毕后是否需要循环，一般用于广告
• preload:
  用来预加载视频，但是需要注意preload和autoplay属性相斥，不能同时设置
• muted:
  用来静音
• width:
  控制宽度
• height:
  控制高度（只推荐设置宽度和高度其中之一，防止视频变形）

1.2 video标签的第二种格式

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

注：没有一种视频格式是所有浏览器都支持的，为了解决这个问题，推出了第二个video标签格式
注意点：当前通过第二种video标签格式虽然能够指定所有浏览器都支持的视频格式，但浏览器必须支持HTML5标签

2.audio标签：

• 作用：播放音频
• 格式：
  （1）

<audio src="">
</audio>

（2）

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

注意：audio标签与video标签使用基本一样，属性基本相同，其中，height/width/poster属性不能使用

3.详情与概要标签：

• 作用：
  利用summary标签来描述概要信息，利用details标签来描述详情信息
• 格式：

<details>
	<summary>概要信息</summary>
	详情信息
</details>

4.marquee标签（*）

marquee标签并不是W3C推荐的标签，但各大浏览器对它的支持非常好

• 作用：跑马灯（其实就是滚动）
• 格式：

<marquee direction="right">内容</marquee>

属性：
direction：设置滚动的方向
scrollamount:设置内容的滚动速度
loop:设置滚动次数
behavior:设置滚动类型（slide、alternate等）
PS:marquee标签除了可以让文字滚动外也可让图片滚动