CSS row-gap 属性

Paglilinaw at paggamit

Ang katangian ng row-gap ay tumutukoy sa pagkakalat ng linya sa layout ng elastic o grid.

Ang katangian ng row-gap ay dating tinatawag na grid-row-gap.

Bilang karagdagan:

CSS TutorialCSS Grid Layout

CSS TutorialCSS Elastic Box Layout

CSS Tagapagbalita ng Manggagamitgap katangian

CSS Tagapagbalita ng Manggagamitcolumn-gap katangian

Sample

Talakayan 1

Tumutukoy sa 50 pixel na pagkakalat ng linya sa grid:

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

Subukan nang personal

Talakayan 2: Layout ng elastic na kahon

I-set ang pagkakalat ng linya sa layout ng elastic na kahon sa 70px:

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

Subukan nang personal

Grammar ng CSS

row-gap: length|normal|initial|inherit;
Halaga Paglalarawan
length I-set ang pagkakalat ng linya ng tinukoy na haba o porsyento ng halaga.
normal Default na halaga. Tumutukoy sa normal na pagkakalat ng linya.
initial I-set ang katangian sa kanyang default na halaga. Tingnan ang: initial.
inherit Mamahala sa katangian mula sa magulang na elemento. Tingnan ang: inherit.

Detalye ng teknolohiya

Default na halaga: normal
Inherisyon: Hindi
Gawa ng animasyon: Sumusuporta. Tingnan ang hiwalay na katangian. Tingnan ang:Mga katangian ng animasyon.
Bersyon: CSS Box Alignment Module Level 3
Grammar ng JavaScript: object.style.rowGap="50px"

Suporta ng browser

Ang numero sa talahanayan ay nagtatalaga ng unang bersyon ng browser na ganap na sumusuporta sa katangian.

Layout Chrome IE / Edge Firefox Safari Opera
Sa grid 66 16 61 12 53
Sa elastic na kahon 84 84 63 14.1 70