自動でサイズ調整されるメインビジュアル等での全画面動画再生(htmlとcssで実装)

[ ID : 3303 ]
自動でサイズ調整されるメインビジュアル等での全画面動画再生(htmlとcssで実装)

概要

キービジュアル等の対象要素の背景に、動画を全画面で表示したい場合の処理について。HTMLとCSSのみで調整する実装方法について紹介。

用途

  • キービジュアルなどの背景に、動画を全画面表示で配置したい。

仕様

  • 動画サイズは画面サイズによりリサイズされます。
  • DEMOでは、動画の上にテキストを配置しています。

注意事項

  • 動画のサイズについて下限のheightなどを設定したい場合は、min-heightを.c-keyvisualに設定してください。

実装方法

このコンテンツの続きを閲覧するにはログインが必要です。 新規会員登録

この記事をシェアする

全ての記事を見る

KONOCODEのメリット 無料会員登録