CSS grid-row-gap 属性

定義と使用方法

grid-row-gap 属性は、グリッドレイアウト内の行間隔のサイズを定義します。

も参照してください：

CSS 教程：CSS グリッドレイアウト

CSS リファレンスマニュアル：grip-gap 属性

CSS リファレンスマニュアル：grip-column-gap 属性

例

行間隔を50ピクセルに設定します：

.grid-container {
  grid-row-gap: 50px;
}

自分で試してみる

CSS 言語

grid-row-gap: length;

属性値

値 説明
length どんな合法な長さの値でも。例えばピクセルやパーセンテージ。デフォルト値は0です。

技術的詳細

デフォルト値： 0
継承： いいえ
アニメーション作成： サポートしています。参照してください：アニメーション関連属性。
バージョン： CSS Grid Layout Module Level 1
JavaScript 言語： object.style.gridRowGap="50px"

ブラウザのサポート

このテーブルの数字は、この属性を完全にサポートする最初のブラウザのバージョンを示しています。

Chrome IE / Edge Firefox Safari Opera
57 16 52 10 44