CSS column-gap egenskap
- Föregående sida column-fill
- Nästa sida column-rule
Definition och användning
column-gap-egenskapen definierar avståndet mellan kolumner.
Kommentar:Om det sätts mellan kolumner column-ruledet kommer att visas i mitten av avståndet.
Se också:
CSS3教程:CSS3 flera kolumner
HTML DOM Referenshandbok:columnGap-egenskapen
Exempel
Definiera avståndet mellan kolumner till 40 pixlar:
div { column-gap: 40px; }
Det finns fler exempel längre ner på sidan.
CSS-syntax
column-gap: längd|normal;
Egenskapsvärde
Värde | Beskrivning | Test |
---|---|---|
längd | Ställ in avståndet mellan kolumner till en specificerad längd. | Test |
normal | Definierar avståndet mellan kolumner som en vanlig avstånd. W3C rekommenderar värdet 1em. | Test |
Tekniska detaljer
Standardvärde: | normal |
---|---|
Arvbarhet: | nej |
Version: | CSS3 |
JavaScript-syntax: | object.style.columnGap="40px" |
Mer exempel
- Column-count
- Delar upp texten i tre kolumner i en div-element.
- Column-rule
- Definierar bredd, stil och färg mellan kolumner.
Webbläsarstöd
Numrerna i tabellen anger den första webbläsarens version som fullständigt stöder egenskapen.
Nummer med -webkit- eller -moz- prefix indikerar den första versionen som använder prefix.
Egenskaper | Chrome | IE / Edge | Firefox | Safari | Opera |
---|---|---|---|---|---|
I flera kolumner | 50 | 10 | 52 | 10 | 37 |
I ett nätverk | 66 | 16 | 61 | 12 | 53 |
I en flexbox | 84 | 84 | 63 | 14.1 | 70 |
- Föregående sida column-fill
- Nästa sida column-rule