CSS3 では、vh は「ウィンドウの高さのパーセンテージ」を意味し、これはウィンドウ単位および相対単位です。vh はウィンドウの高さに対する相対値であり、ウィンドウはクライアントの表示領域です。ブラウザの領域、ウィンドウを 100 単位に均等に分割し、1vh のサイズはウィンドウの高さの 100 分の 1 です。
このチュートリアルの動作環境: Windows 10 システム、CSS3&&HTML5 バージョン、Dell G3 コンピューター。
vh はビューポート (ビューポート) の高さを基準にして決定され、1vw はビューポートの幅の 1/100 に等しくなります。
クライアント側では、ビューポートはブラウザの表示領域を指します。
モバイル側では、レイアウト ビューポート (レイアウト ビューポート)、ビジュアル ビューポート (ビジュアル ビューポート)、理想的なビューポート (理想的なビューポート)。 「ビューポート」とは、タスクバーのタイトルバーやタスクバーのブラウザ領域のサイズを除いた、ブラウザ内の表示領域のサイズ、つまりwindow.innerWidth/window.innerHeightのサイズを指します。下部のツールバー。
vh ユニットは、ウィンドウの高さに応じてサイズを自動的に変更できます。1vh はウィンドウの高さの 1% です。
vw と vh はビューポート (ビューポート、ビューポート、水平線、または可視範囲の幅と高さとも呼ばれます)。
拡張知識:
vw: ビューポート幅のパーセンテージ (1vw はビューポート幅の 1% に等しい)
vh: ビューポートwidth ポートの高さのパーセンテージ (1vh はビューポートの高さの 1% に相当します)
vmin: vw と vh の間で最小のものを選択します
vmax: vw と vh の間で最大のものを選択します
vw、vh は、親要素ではなくビューポートに基づいています。 1vw はビューポートの幅の 1/100 に等しく、1vh はビューポートの高さの 1/100 に等しくなります。例:
ブラウザの高さは 950 ピクセル、幅は 1920 ピクセル、1vh = 950px/100 = 9.5 px、1vw = 1920px/ 100 =19.2 px
vw、vh、および %
% の差は、親のサイズを基準にして設定された比率です。要素、vw vh はビューポート サイズによって決まります。
vw と vh は高さを直接取得できますが、% ボディの高さが設定されていない場合、表示領域の高さを取得できません。
(学習ビデオ共有: css ビデオ チュートリアル)
以上がcss3でvhは何を意味しますかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。