video ファイルと代替え画像を用意します。video ファイルは各ブラウザに対応するため .mp4、.ogv、.webmの3 種類を用意します。 ※動画は、ユーザーのページの読み込み時間や再生時の挙動を削減するため4MB 以下を目安に制作しましょう。 ※無料の高画質video 素材は Pixabay (https://pixabay.com/)などのサービスを活用しましょう。 body内の背景動画を表示させたい場所にHTMLを記載します。 <header id="header"> <h1>Title</h1> <div id="video-area"> <video id="video" poster="img/movie.jpg" webkit-playsinline playsinline muted autoplay loop> <!-- poster:動画ファイルが利用できない
![画面全体に背景動画を流す | 動くWebデザインアイディア帳](https://cdn-ak-scissors.b.st-hatena.com/image/square/5b38c32cd6eebe7d4d32b8a2550050d0eaccce6c/height=288;version=1;width=512/https%3A%2F%2Fcoco-factory.jp%2Fugokuweb%2Fwp-content%2Fuploads%2F2020%2F12%2Fmovie.png)