HTML5ビデオ(ビデオ)



多くのサイトでビデオが使用されており、HTML5 はビデオを表示するための標準を提供します。

Web サイト上のビデオ

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

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

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


ブラウザのサポート

Internet Explorer

Internet Explorer 9 以降、Firefox、Opera、Chrome、Safari は <video> 要素をサポートします。

Internet Explorer 8 以前のバージョンでは <video> がサポートされません。 ; 要素。

HTML5 (ビデオ) - 仕組み


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

インスタンス

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
  您的浏览器不支持 HTML5 video 标签。
</video>

</body>
</html>

インスタンスの実行»
[インスタンスの実行] ボタンをクリックしてオンライン インスタンスを表示します

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

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

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