CSS grid-column egenskab
- Forrige side grid-auto-rows
- Næste side grid-column-end
Definition og brug
grid-column-egenskaben definerer størrelsen på netværksobjekterne og deres placering i netværkslayoutet og er en forkortelse for følgende egenskaber:
Se også:
CSS-turorial:CSS-gitterlayout
Eksempel
Eksempel 1
Lad "item1" starte i kolonne 1 og krydse to kolonner:
.item1 {
grid-column: 1 / span 2;
}
Eksempel 2
Du kan bruge kolonnekantværdien i stedet for antallet af kolonner, der skal krydses:
.item1 {
grid-column: 1 / 3;
}
CSS-sprog
grid-column: grid-column-start / grid-column-end;
Egenskabsværdi
| Værdi | Beskrivelse |
|---|---|
| grid-column-start | Angiver fra hvilken kolonne visningen af objekterne starter. |
| grid-column-end | Angiver hvor på hvilken kolonnekant (column-line) visningen af objekterne stopper, eller hvor mange kolonner de krydser. |
Tekniske detaljer
| Standardværdi: | auto / auto |
|---|---|
| Arv: | Nej |
| Animationproduktion: | Understøttet. Se venligst:Animation-relaterede egenskaber. |
| Version: | CSS Grid Layout Module Level 1 |
| JavaScript-sprog: | object.style.gridColumn="2 / span 2" |
Browser-understøttelse
Tabelens tal angiver den første browserversion, der fuldt ud understøtter egenskaben.
| Chrome | IE / Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| 57 | 16 | 52 | 10 | 44 |
- Forrige side grid-auto-rows
- Næste side grid-column-end
