row-gap (grid-row-gap)

介绍

row-gap/grid-row-gap 属性用来设置弹性布局和网格布局行元件之间的间隙（gutter）大小。

为了兼容性，可使用 row-gap 或 grid-row-gap。

使用示例

取值

`<length>`

<length> 表示弹性布局或网格布局行之间的间隙宽度。

`<percentage>`

行之间直接的间隙宽度，<percentage> 相对容器自身 content area 纵向大小的百分比。

形式语法

row-gap = <length-percentage [0,∞]>

<length-percentage> = <length> | <percentage>

语法

/* <length> values */
row-gap: 20px;
grid-row-gap: 20px;
row-gap: 1em;
grid-row-gap: 1em;

/* <percentage> value */
row-gap: 10%;
grid-row-gap: 10%;

/* calc() values */
row-gap: calc(10% + 20px);
grid-row-gap: calc(10% + 20px);

形式定义

初始值	`0`
适用元素	弹性容器和网格容器
是否支持继承	否
是否支持动画
百分比	refer to vertical dimension of its own content area

与 Web 的区别

mdn: row-gap

不支持 normal。

兼容性

LCD tables only load in the browser

#row-gap (grid-row-gap)

#介绍

#使用示例

#取值

#<length>

#<percentage>

#形式语法

#语法

#形式定义

#与 Web 的区别

#兼容性

#常见问题