HTML5 video

video

controls

再生ボタン等のコントローラー表示

<video controls>
 <source src="〜.mp4">
</video>

preload

動画の事前読込

<video preload="none">
 <source src="〜.mp4">
</video>

source

src

動画ファイル指定

<video>
 <source src="〜.mp4">
</video>

autoplay

自動再生

<video>
 <source src="〜.mp4" autoplay>
</video>

muted

無音性
Chrome等いくつかのブラウザでは無音性でないとautoplayが効かない

<video>
 <source src="〜.mp4" autoplay muted>
</video>

loop

連続再生

<video>
 <source src="〜.mp4" autoplay muted loop>
</video>

playsinline

レウポンシブ用インライン表示

<video>
 <source src="〜.mp4" autoplay muted loop playsinline>
</video>

サイズ

<style>
 video {
  width: 100%;
 }
</style>
<video>
 <source src="〜.mp4">
</video>

Follow me!

前の記事

AWS CloudFormation

次の記事

GCP Google Cloud SDK