line-height-step

CSS の line-height-step プロパティは、行ボックスの高さにおける刻みの単位を設定します。このプロパティが設定された場合、行ボックスの高さは単位の倍数のうち最も近いものに切り上げられます。

/* ポイント値 */
line-height-step: 18pt;

構文

line-height-step プロパティは、以下のうちの一つで指定します。

• <length>

値

<length>

指定された <length> が、行ボックスの高さの刻みの計算に使用されます。

形式文法

<length>

例

以下の例では、それぞれの段落の行ボックスの高さは、刻みの単位に切り上げられます。 <h1> の行ボックスの高さは１つの刻みに収まらないので２つ分を占有しますが、その中の中央に配置されます。

:root {
  font-size: 12pt;
  --my-grid: 18pt;
  line-height-step: var(--my-grid);
}
h1 {
  font-size: 20pt;
  margin-top: calc(2 * var(--my-grid));
}

これらの規則の結果は、次のスクリーンショットのようになります。

仕様書

ブラウザーの対応

このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 https://github.com/mdn/browser-compat-data をチェックアウトしてプルリクエストを送信してください。

関連情報

• font
• font-size
• line-height