CSSの100vhとは何ですか

CSS では、「100vh」はサイズ「100」の相対的な長さの値を指し、単位は「vh」です。「vh」は CSS の相対的な長さの単位であり、高さに相対的です。 「100vh」は、要素の高さが現在のブラウザのビュー ウィンドウの高さ、つまりブラウザ内の表示領域の高さに等しいことを意味します。

このチュートリアルの動作環境: Windows 10 システム、CSS3&&HTML5 バージョン、Dell G3 コンピューター。

CSS における 100vh とは

vh は CSS における相対的な長さの単位です。ウィンドウの高さを基準にして、ウィンドウは vh の 100 単位に均等に分割されます。つまり、1vh は常に現在のウィンドウの高さと等しくなります。1 パーセントです。

ウィンドウは vh の 100 単位に分割されます。 vh の利点は高さを直接取得できることですが、% を使用すると体の高さを設定しないと視覚領域の高さを正しく取得できません。

ビューポートとは、タスクバーのタイトルバーと下部のブラウザ領域のサイズを除いた、ブラウザ内の表示領域のサイズ、つまりwindow.innerWidth/window.innerHeightのサイズを指します。ツールバー。

したがって、100vh は現在のブラウザのウィンドウの高さ、つまりブラウザ内の表示領域の高さに等しくなります。

高さを 100vh に設定すると、要素にコンテンツがなくても、要素は画面と同じ高さに引き伸ばされます

拡張知識:

• vh: ウィンドウの高さに応じて、ウィンドウは vh の 100 単位に分割されます;

• vw: ウィンドウの高さに対する相対値 ウィンドウの幅は、vw;

• vmax: ウィンドウに対する幅または高さの大きい方の単位に分割されます。最大のものは vmax;

• vmin の 100 単位に分割されます。ビューポートの幅または高さに比べて小さいもの。最小のものは vmin の 100 単位に均等に分割されます;

(学習ビデオ共有: css ビデオ チュートリアル 、html ビデオ チュートリアル )

以上がCSSの100vhとは何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。