レスポンシブWebデザイン - ビデオ(動画)2024 年の最新の入門チュートリアル。このコースでは width属性を使用します,例,max-widthプロパティを使用して、,例,ビデオページを追加します,例, について学習できます。

レスポンシブWebデザイン - ビデオ(動画)

width属性を使用します

width属性を100%に設定されている場合、ビデオプレーヤは、自動的に画面サイズに比例して調整されます。

ビデオ{
幅:100%;
高さ:自動;
}

»をお試しください

上記の例では、ビデオプレーヤーが自動的に画面の大きさに比例して調整されて、元のサイズよりも大きくすることができることに留意されたいです。 多くの場合、我々は代わりのmax-widthプロパティを使用することができます。


max-widthプロパティを使用して、

max-widthプロパティを100%に設定されている場合は、ビデオプレーヤーが自動的に画面に比例して調整しませんが、元のサイズよりも多くされます。

ビデオ{
max-width:100%;
高さ:自動;
}

»をお試しください

ビデオページを追加します

私たちは、ウェブページにビデオを追加することができます。 以下の実施例およびビデオは自動的に領域が全体のdiv divの領域のサイズを占めているに応じて調整されます。

ビデオ{
幅:100%;
高さ:自動;
}

»をお試しください
レスポンシブWebデザイン - ビデオ(動画)
10/30