ホームページ  >  記事  >  ウェブフロントエンド  >  html5のvideoタグの詳しい紹介

html5のvideoタグの詳しい紹介

不言
不言転載
2018-10-26 14:50:084708ブラウズ

この記事では、HTML5 の video タグについて詳しく説明します。必要な方は参考にしていただければ幸いです。

<video src="http://www.lorem.com/video/lorem.mp4" controls="controls" width="500" height="300"></video>

39000f942b2545a5315c57fa3276f220 タグでサポートされているビデオ形式とエンコーディング:

MP4 = H264 ビデオ コーデックおよび AAC オーディオ コーデックを使用する MPEG 4 ファイル

WebM = WebM ファイルを使用VP8 ビデオ コーデックと Vorbis オーディオ コーデック

Ogg = Ogg ファイルは Theora ビデオ コーデックと Vorbis オーディオ コーデックを使用します

上記の情報により、h264 でエンコードされた MP4 ビデオ (MPEG-LA 社) のみが見つかります。 、VP8 でエンコードされた webm 形式のビデオ (Google 社) と Theora でエンコードされた ogg 形式のビデオ (iTouch 開発) は、HTML5 の 39000f942b2545a5315c57fa3276f220 タグをサポートできます。

ブラウザが video タグをサポートしていない場合はどうすればよいですか?

たとえば、IE ブラウザと古いバージョンのブラウザは HTML5 をあまりサポートしていません。ユーザーがこれらのブラウザを使用してビデオを含む Web ページを開いた場合はどうすればよいでしょうか。

コードは次のように記述できます:

<video src="http://sp.ntaotu.com/localhost-wordpress-phpstudy.mp4" controls="controls" width="500" height="300">您的浏览器不支持播放该视频!</video>

このように、html5 をサポートしていないブラウザでは、「お使いのブラウザはこのビデオの再生をサポートしていません!」というメッセージが表示されます。

video タグの拡張パラメータの説明について:

video 要素では複数のソース要素を使用できます。ソース要素は、異なるビデオ ファイルをリンクできます。ブラウザは最初に認識された形式を使用するため、別の形式でさらにいくつかのビデオを準備するだけで済みます。

使用法:

<video width="500" height="250" controls="controls">
<source src="movie.ogg" type="video/ogg">
<source src="movie.mp4" type="video/mp4">
您的浏览器不支持此种视频格式。
</video>

autoplay: この属性の存在は、ビデオが準備ができた後に自動的に再生されることを意味します。 使用法: autoplay="autoplay"

controls:この属性の出現は、再生ボタンなどのコントロールをユーザーに表示することを意味します。 使用法:controls="controls"

height:高さの設定

width:幅の設定

loop: 自動再生、使用法:loop="loop"

preload: ページがロードされると、ビデオがロードされ、再生の準備が整います。 使用法: preload="auto" - ビデオ全体をロードします。ページの読み込み時; preload="meta" - ページの読み込み時にのみメタデータを読み込みます; preload="none" - ページの読み込み時にビデオを読み込みません。注: 自動再生を使用する場合は、preload を無視してください。

src: ビデオを再生するための URL

ここで 39000f942b2545a5315c57fa3276f220 タグについて説明します。このタグについては誰もが深く理解していると思います。理解!

以上がhtml5のvideoタグの詳しい紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はcsdn.netで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。