网页里面怎么加视频(网页中怎么添加视频)

本文主要介绍HTML页面插入视频的方法总结，有需要的朋友可以参考一下。

现在，如果你想在页面中使用视频标签，你需要考虑三种情况:支持Ogg Theora或者VP8的(如果这东西没毛病的话)(Opera，Mozilla，Chrome)，支持H.264的(Safari，IE 9，Chrome)，都不支持的(IE6，7，8)。好了，现在我们从技术层面来理解HTML 5的视频，包括视频标签的使用，视频对象可以使用的媒体属性和方法，媒体事件。

视频标签的使用

视频标签包含几个属性，如src、poster、preload、autoplay、loop、controls、width、height和一个内部标签< source & gt。视频标签可以包含

(1) src属性和poster属性

你能想象src属性是用来干啥的。跟<img>标签的一样，这个属性用于指定视频的地址。而poster属性用于指定一张图片，在当前视频数据无效时显示（预览图）。视频数据无效可能是视频正在加载，可能是视频地址错误等等。
你可以想象src属性是用来做什么的。遵循< img >标签，这个属性用来指定视频的地址。poster属性用于指定当前视频数据无效时要显示的图片(预览)。无效视频数据可能是视频正在加载，视频地址可能是错误的等等。

(2)预加载属性

该属性也可以按名称使用。此属性用于定义视频是否预加载。属性有三个可选值:无、元数据和自动。如果不使用该属性，则默认为auto。

无:无预载。使用这个属性值，可能是页面创建者认为用户不期望这个视频，或者减少了HTTP请求。

元数据:部分预加载。使用这个属性值意味着页面创建者认为用户并不期待这个视频，而是为用户提供了一些元数据(包括大小、第一帧、曲目列表、时长等。).

自动:全部预加载。

(3)自动播放属性

另一个可以通过名称使用的属性。Autoplay属性用于设置视频是否自动播放，是一个布尔属性。出现的时候表示自动播放，去掉的话表示没有自动播放。

注意，HTML中的布尔属性值不是true和false。正确的用法是在标签中使用这个属性来表示true，当这个属性要么没有值，要么它的值总是等于他的名字(这里，自动回放是

(4)循环属性

一目了然，loop属性用于指定视频是否循环播放，这也是一个布尔属性。

(5)控件属性

Controls属性用于向浏览器指示页面创建者没有使用脚本来生成播放控制器，浏览器需要启用自己的播放控制栏。

控制栏必须包括播放暂停控制、播放进度控制、音量控制等等。

每个浏览器的默认播放控制条在界面上是不同的。因为我浏览器的怪异问题，Firefox和Safari的视频标签都不正常，所以这两个只能在网上找截图了。

(6)宽度属性和高度属性

属于标签的一般属性，不言而喻。

(7)源标记

Source标签用于为媒体指定多个可选的文件地址(因为audio标签也可以包含这个标签，所以这里用的是媒体而不是视频)，只有当media标签不使用src属性时才能使用。

浏览器根据源标签的顺序检测标签指定的视频是否可以播放(可能是不支持视频格式，视频不存在等。)，如果不能播放，就切换到下一个。这种方法通常用于兼容不同的浏览器。源标签本身不代表任何意义，不能单独出现。

这个标签包含三个属性:src、type和media。

Src属性:用来指定媒体的地址，就像video标签一样。

Type属性:用于解释src属性指定的媒体类型，帮助浏览器在获取媒体之前判断是否支持该类别的媒体格式。

媒体属性:用于描述所使用的媒体。如果未设置，默认值为all，这意味着支持所有媒体。你认为呢

(8)一个完整的例子

这段代码定义了页面中的一个视频。这个视频的预览是poster的属性值，显示浏览器默认的媒体控制栏，预加载视频的元数据，循环播放，宽度900像素，高度240像素。

首先选择的视频地址是第一个源标签的src属性值，视频类别是Ogg视频，视频编解码器是Theora，音频编解码器是Vorbis，播放媒体是显示器；第二个选择的视频地址不重复。如果想兼容IE，可以在最后一个source标签后面加上Flash player的标签集，或者用一点JavaScript代码。

以上是如何在HTML页面中插入视频的细节总结。更多信息请关注AdminJS.cn其他相关文章！