共通CSSユニット_html/css_WEB-ITnose

1em=12pt

2em=24pt

body {
font-size: 14px;
}
div {
font-size: 1.2em; // 14px * 1.2、または 16.8p x
で計算されます }

div のフォント サイズは 1.2em で、これは div が親要素から継承するフォント サイズの 1.2 倍です。ここで、本文のフォント サイズは 14px で、div のフォント サイズは 1.2*14=16.8px です。

注: em を使用して、ネストされた要素のフォント サイズをレイヤーごとに定義します

is em rem

に変更します

rem

remのrはルート要素を表し、その値はルート要素で設定されたフォントサイズになります。ほとんどの場合、ルート要素は html です。

html {

font-size: 14px;

}

div {

font-size: 1.2rem;

}

rem はフォントサイズだけでなくグリッドレイアウトにも使用されます。

width: 70rem; // 70 * 14px = 980px

HTML ルート要素のフォント サイズに基づいて rem をグリッド レイアウト全体または UI ライブラリのサイズ単位として使用し、他の特定の単位では em 単位を使用できます。場所。これにより、フォント サイズとスケーリングをより詳細に制御できるようになります

letter-spacing と word-spacing

letter-spacing と word-spacing は両方とも、要素内に対応する空白を追加するために使用されます。文字間隔は文字間にスペースを追加し、単語間隔は各単語の間にスペースを追加します。中国語では単語間隔は無効であることに注意してください。

letter-spacing

構文: Letter-spacing:normal | length
パラメータ:
Normal: デフォルトの間隔
length: 浮動小数点数と単位識別子で構成される長さの値、負の値も許可されます。長さの単位を参照してください
説明:
オブジェクト内のテキスト間のスペースを取得または設定します。
この属性は各単語の後に指定されたスペースを追加しますが、最後の単語は除外されます。
対応するスクリプト機能はletterSpacingです。

Word-SPACING

構文:
Word-Spacing: Normal | LENGTH パラメーター: Normal: デフォルトの距離
length: 浮動小数点数と単位識別子の長さの値は許容されます負の値。 「長さの単位」を参照してください
説明:
オブジェクト内の単語の間に挿入されるスペースの数を取得または設定します。 IE4+ の場合は MAC プラットフォームでのみ利用可能です。
対応するスクリプト機能は wordSpacing です。

比較:
文字間隔は単語間の距離を定義します。

??