HTML 5 ビデオ ストレッチ 質問する

HTML 5 ビデオ ストレッチ 質問する

ビデオをビデオ要素の幅と高さに合わせて「引き伸ばす」ことはできますか? どうやらデフォルトでは、ビデオはビデオ要素内に比例して拡大縮小され、収まるようです。

ありがとう

ベストアンサー1

CSSでobject-fit: fillを使用してテストしました

うまく動作します。

video {
  object-fit: fill;
}

MDNより(https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit):

object-fit CSS プロパティは、置換された要素の内容を、その使用された高さと幅によって確立されたボックスにどのように適合させるかを指定します。

値: 塗りつぶし

置き換えられたコンテンツは、要素のコンテンツ ボックスを埋めるようにサイズが設定されます。オブジェクトの具体的なオブジェクト サイズは、要素の使用されている幅と高さになります。

おすすめ記事