CSS row-gap thuộc性能

定義和用法

row-gap 屬性規定彈性框或網格佈局中行之間的間隙。

row-gap 屬性以前稱為 grid-row-gap。

另請參考：

CSS 教程：CSS 網格佈局

CSS 教程：CSS 強性框佈局

CSS 參考手冊：gap 屬性

CSS 參考手冊：column-gap 屬性

實例

例子 1

規定網格行之間的 50 像素間隙：

#grid-container {
  display: grid;
  row-gap: 50px;
}

親自試試

例子 2：彈性框佈局

在彈性框佈局中将行間距設定為 70px：

#flex-container {
  display: flex;
  row-gap: 70px;
}

親自試試

CSS 語法

row-gap: length|normal|initial|inherit;
值 描述
length 設定行之間間隙的指定長度或百分之百值。
normal 默認值。規定行之間的正常間隙。
initial 將此屬性設定為其默認值。參閱 initial。
inherit 從其父元素繼承此屬性。參閱 inherit。

技術細節

默認值： normal
繼承： 否
動畫製作： 支持。請查看單獨的屬性。請參閱：動畫相關屬性。
版本： CSS Box Alignment Module Level 3
JavaScript 語法： object.style.rowGap="50px"

瀏覽器支持

表格中的數字注明了完全支持該屬性的首個瀏覽器版本。

佈局 Chrome IE / Edge Firefox Safari Opera
在網格中 66 16 61 12 53
在彈性框中 84 84 63 14.1 70