HTML5から<img>タグで画像を表示させるように<video>タグで動画を
表示できるようになりました。
サンプルコード
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>HTMLのメモ</title> </head> <body> <video src="https://www.youtube.com/watch?v=My2FRPA3Gf8" controls width="320" height="240"></video> </body> </html> |
表示例
今回新しく登場する属性で、controls属性があります。
論理属性と呼ばれていて、「controls」と書くだけで機能します。
videoタグがサポートされていないブラウザがあったら
videoタグは開始タグと終了タグの間に何もいれなくても動きます。
下記のサンプルコードのようにするとサポートされていないブラウザでは
テキストが表示されるようになります。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>HTMLのメモ</title> </head> <body> <video src="https://www.youtube.com/watch?v=My2FRPA3Gf8" controls width="320" height="240"> <p>お使いのブラウザでは、videoは見れません</p> </video> </body> </html> |