css3に追加された新しいユニットは何ですか-フロントエンドQ&A-php.cn

css3に追加された新しいユニットは何ですか

青灯夜游

リリース： 2022-01-12 17:17:07

オリジナル

2104 人が閲覧しました

css3 で追加された新しい単位: 1. "ch"、文字 0 の幅、2. "rem"、主にルート要素のフォントのサイズに関連する相対単位、3. "vw" 、ウィンドウの幅、4. "vh"、ウィンドウの高さ、5. "vmin"、6. "vmax" など。

css3に追加された新しいユニットは何ですか

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

CSS3 の新しい長さの単位

CSS3 の新しい長さの単位は次のとおりです。

ch (文字 0
rem の幅) は相対単位であり、主にルート要素のフォントのサイズに関連します。 rem を使用するには、指定されたルート要素を参照する必要があります。
vw、ビューポイント幅、ウィンドウ幅、1vw=ウィンドウ幅の 1%
vh 、視点の高さ、ウィンドウの高さ、1vh=ウィンドウの高さの 1%
vmin、vmax など

新しく追加された視点関連ユニットは、通常、モバイルデバイスを対象としています。

rem は実際には em と同じものですが、rem にはルート要素 (html 要素) を表す追加の制限がある点が異なります。フォントサイズ。次の例で、

rem と em の違いを確認できます。

<html style="font-size: 12px;">
<body>
    <div id="div1" style="font-size: 16px">
        <div id="div2" style="font-size: 1.2em"></div>
        <div id="div3" style="font-size: 1.2rem">
            <div id="div4" style="font-size: 1.2em"></div>
        </div>
    </div>
</body>
</html>

ログイン後にコピー

現時点では、