HTML之音视频

最新推荐文章于 2023-12-13 15:33:19 发布

原创最新推荐文章于 2023-12-13 15:33:19 发布 · 1.5k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#html #h.264 #浏览器 #video #xhtml #服务器

html 专栏收录该内容

20 篇文章

订阅专栏

1：视频

<video> 标签定义视频，比如电影片段或其他视频流。

<video src="movie.ogg" controls="controls">您的浏览器不支持 video 标签。</video>

2：视频格式

video元素支持的创建视频格式和对于不同视频格式的浏览器支持

视频格式	IE	Firefox	Opera	Chrom
Ogg	NO	3.5	10.5	5.0
H.264	9.0	NO	NO	5.0
MPEG-4	9.0	NO	NO	5.0
WebM	9.0*	4.0	10.6	6.0

Ogg是带有Thedora视频编码和Vorbis音频编码的Ogg文件

H.264是带有H.264视频编码和AAC音频编码的视频文件

MPEG-4是ISO/IEC标准的视频、音频编码标准，通常也是mp4文件

WebM是Google提出的标准，实际上就是VP8视频编码加上Vorbis，IE仅在安装了VP8解码器时才会支持WebM视频

属性：

属性	值	描述
autoplay	autoplay	如果出现该属性，则视频在就绪后马上播放。
controls	controls	用来设置是否为视频添加控件，如播放、暂停、进度条、音量等，如果视频播放器的宽度无法展开控件的长度，那么就会仅显示”播放”、”暂停”两个控件，控制条的外观可以自定义
height	pixels	设置视频播放器的高度。
loop	loop	如果出现该属性，则当媒介文件完成播放后再次开始播放。
preload	preload	用于定义视频是否预加载，属性有3个可选择的值：none, metadata和auto，默认为auto (1) none: 不进行加载，使用此属性值，可能是网页创建者期望用户并不太需要此视频，或者为了减少HTTP请求以降低服务器负载。 (2) metadata：部分预加载。使用此属性值，可能是网页创建者期望用户并不太需要此视频，但为用户提供一些元数据(包括尺寸、第一帧、曲目列表和持续时间) (3) auto：全部预加载。要求浏览器首先把加载视频放在重要的位置，不要关心服务器负载。如果定义了autoplay, 则忽略该属性
src	url	要播放的视频的 URL。

3：音频

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>音频</title>
</head>

<body>
   <audio src="老男孩.mp3" controls="controls">
       您的浏览器不支持HTML5音频功能呢个
   </audio>
</body>
</html>