Html多媒体处理

图片

html通过<img>标签引入图片，一个img标签一般包括以下几个部分：

• src：指向引入图片的路径。
• alt：它的值应该是对图片的文字描述，用于在图片无法显示或不能被看到的情况。
• width: 图片的宽度。
• height： 图片的高度
• title： 图片的标题

html5提供了图题标签<figcaption>，用于解释图片内容。

视频

<video> 可以轻松地嵌入一段视频。一般包括以下部分：

• src: 同 <img> 标签使用方式相同，src 属性指向想要嵌入网页当中的视频资源。
• controls: 用户能够控制视频和音频的回放功能.可以使用 controls 来包含浏览器提供的控件界面，也可以使用合适的 JavaScript API 创建自己的界面。界面中至少要包含开始、停止以及调整音量的功能。
• width 和 height： 可以用属性控制视频的尺寸，也可以用 CSS 来控制视频尺寸。 无论使用哪种方式，视频都会保持它原始的长宽比 — 也叫做纵横比。如果你设置的尺寸没有保持视频原始长宽比，那么视频边框将会拉伸，而未被视频内容填充的部分，将会显示默认的背景颜色。
• autoplay： 这个属性会使音频和视频内容立即播放，即使页面的其他部分还没有加载完全。
• loop： 这个属性可以让音频或者视频文件循环播放。
• muted：这个属性会导致媒体播放时，默认关闭声音。
• poster： 这个属性指向了一个图像的URL，这个图像会在视频播放前显示。通常用于粗略的预览或者广告。
• preload：这个属性被用来缓冲较大的文件，有3个值可选：
  • “none” ：不缓冲
  • “auto” ：页面加载后缓存媒体文件
  • “metadata” ：仅缓冲文件的元数据

音频

音频使用<audio>标签，用法和视频标签基本一致，但是没有width、height、poster这几个属性。