CSS row-gap egenskap

Definition och användning

row-gap egenskapen specificerar avståndet mellan rader i en elastisk eller nätverkslayout.

row-gap egenskapen kallades tidigare grid-row-gap.

Se också:

CSS教程:CSS Nätverkslayout

CSS教程:CSS Elastisk Layout

CSS Referenshandbok:gap egenskap

CSS Referenshandbok:column-gap egenskap

Exempel

Exempel 1

Specificera 50 pixlar mellan rader i ett nätverk:

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

Prova själv

Exempel 2: Elastisk layout

Ställ in radavståndet till 70px i en elastisk layout:

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

Prova själv

CSS-syntax

row-gap: length|normal|initial|inherit;
Värde Beskrivning
length Ställ in det specifika avståndet mellan rader i längd eller procent.
normal Standardvärde. Bestämmer den normala avståndet mellan rader.
initial Sätt denna egenskap till dess standardvärde. Se: initial.
inherit Får denna egenskap från sin förälderelement. Se: inherit.

Tekniska detaljer

Standardvärde: normal
Ärvande: Nej
Animeringsproduktion: Stöds. Se enskilda egenskaper. Se också:Animeringsrelaterade egenskaper.
Version: CSS Box Alignment Module Level 3
JavaScript-syntax: object.style.rowGap="50px"

Webbläsarstöd

Talen i tabellen anger den första webbläsarens version som fullständigt stöder egenskapen.

layout Chrome IE / Edge Firefox Safari Opera
i ett nätverk 66 16 61 12 53
i en elastisk ram 84 84 63 14.1 70