HTML5ビデオ(ビデオ)

HTML5 ビデオ

Web サイト上のビデオ

これまで、Web ページ上にビデオを表示するための標準はありませんでした。

現在、ほとんどのビデオはプラグイン (Flash など) を介して表示されます。ただし、すべてのブラウザに同じプラグインがあるわけではありません。

HTML5 は、video 要素を介してビデオを含める標準的な方法を指定します。

HTML5 (ビデオ) - 仕組み

HTML5 でビデオを表示するには、次のものが必要です:

インスタンス

<video width="320" height="240" controls>
  <source src="视频文件名称" type="视频格式">
  <source src="视频文件名称" type="视频格式">
您的浏览器不支持Video标签。
</video>

autoplay 属性

インスタンス

ビデオを自動再生するように設定する 要素:

<video controls="controls" autoplay="autoplay"> 
 <source src="视频文件名称" type="视频格式"> 
  <source src="视频文件名称" type="视频格式">
您的浏览器不支持Video标签。
</video>

controls: この属性が表示される場合、再生ボタンなどのコントロールがユーザーに表示されます。

<video> 要素は、ビデオを制御するための再生、一時停止、および音量のコントロールを提供します。

同時に、<video> 要素はビデオのサイズを制御する幅と高さの属性も提供します。高さと幅が設定されている場合、ページが読み込まれるときに必要なビデオ領域が予約されます。 。これらのプロパティが設定されておらず、ブラウザーがビデオのサイズを認識していない場合、ブラウザーは読み込み時に特定のスペースを予約できず、ページは元のビデオのサイズに基づいて変更されます。

<video> タグと </video> タグの間に挿入されたコンテンツは、video 要素をサポートしていないブラウザーに提供されます。

ビデオ形式とブラウザのサポート

現在、<video> 要素は MP4、WebM、Ogg の 3 つのビデオ形式をサポートしています:

ブラウザ MP4 WebM Ogg

エクスプローラーはいいいえクロムはいはいはいはいはいはいはいはいファイル

webm= VP8ビデオエンコードとVorbisオーディオエンコーディング

gg= oggファイルを備えたTheoraビデオエンコードとVorbisオーディオエンコーディング