line-height-step
line-height-step
は CSS のプロパティで、行ボックスの高さにおける刻みの単位を設定します。このプロパティが設定された場合、行ボックスの高さは単位の倍数のうち最も近いものに切り上げられます。
/* ポイント値 */
line-height-step: 18pt;
構文
line-height-step
プロパティは、以下のうちの一つで指定します。
値
形式文法
line-height-step =
<length>
例
以下の例では、それぞれの段落の行ボックスの高さは、刻みの単位に切り上げられます。 <h1>
の行ボックスの高さは1つの刻みに収まらないので2つ分を占有しますが、その中の中央に配置されます。
:root {
font-size: 12pt;
--my-grid: 18pt;
line-height-step: var(--my-grid);
}
h1 {
font-size: 20pt;
margin-top: calc(2 * var(--my-grid));
}
これらの規則の結果は、次のスクリーンショットのようになります。
仕様書
仕様書 | 状態 | 備考 |
---|---|---|
CSS Rhythmic Sizing line-height-step の定義 |
草案 | 初回定義 |
ブラウザーの互換性
BCD tables only load in the browser