Hisia ya CSS grid-column

Ufafanuzi na Matumizi

Tabia ya grid-column inasababisha ukubwa wa majina ya mbinu na upeo wao kwenye muundo wa grid, ni tabia ya kifupi ya tabia hizo:

Tazama pia:

CSS Mafunzo:CSS Vifungo vya Inayofanana na Kichwa cha Rangi

Mfano

Matokeo 1

Inasababisha "item1" kuwakilika kuanza kwenye barabara ya siku ya 1 na kusafirisha kati ya manje mbili:

.item1 {
  grid-column: 1 / span 2;
}

Tafiri mwenyewe

Matokeo 2

Unaweza kutumia thamani ya barabara ya siku kuhusu manje ya kusafirisha:

.item1 {
  grid-column: 1 / 3;
}

Tafiri mwenyewe

Inayotumia KiCSS

grid-column: grid-column-start / grid-column-end;

Chaguo cha tabia

Wakati Maelezo
grid-column-start Inasababisha kufikia kuanza kumaliza uonekano wa majina kwenye chaguo cha barabara ya siku (column-line).
grid-column-end Inasababisha kufikia kwa kumaliza uonekano wa majina kwenye chaguo cha barabara ya siku (column-line) au kusababisha kusafirisha kwa kubuniwasha kati ya manje.

Mifumo ya viwanda

Chaguo cha kuzingatia: auto / auto
Kuwasiliana: Hai
Harakisha ya mchora: Inasimamia. Tazama:Mafuta ya harakisha.
Sia: CSS Grid Layout Module Level 1
Inayotumia KiJavaScript: object.style.gridColumn="2 / span 2"

Inasimamia wa browser

Mafuatilia ya tabia hizi inatoa na browser ya kwanza ambayo inahakikisha inasimamia tabia hii.

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