English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

Manuale di riferimento CSS

Regole CSS @ (RULES)

Completo di attributi CSS

Metodo e esempio di utilizzo dell'attributo CSS3 column-gap

L'attributo CSS column-gap specifica l'intervallo tra le colonne degli elementi multi-colonna. Se tra le colonne c'è uncolumn-ruleSarà posizionato al centro dello spazio.

La seguente tabella descrive l'uso di questa proprietà, la cronologia delle versioni e la sintassi dell'uso in script JavaScript.

Valore predefinito:normal
Applicabile a:Elementi a più colonne
Ereditabile:No
Animabile:Sì.Attributi animazione.
Versione: Nuove funzionalità del CSS3
Sintassi JavaScript:object.style.columnGap="50px"

Sintassi dell'uso di column-gap

La sintassi di questo attributo è la seguente:

column-gap:　　|　normal　|　initial　|　inherit

Ecco come viene utilizzato l'attributo column-gap.

p　{
　　　　-webkit-column-gap:　50px;　/*　Chrome,　Safari,　Opera　*/
　　　　　　　-moz-column-gap:　50px;　/*　Firefox　*/
　　　　　　　　　　　　column-gap:　50px;　
}
Testa per vedere‹/›

Valore dell'attributo

La seguente tabella descrive i valori di questa proprietà.

ValoreDescrizione
lengthUn valore di lunghezza che definisce la dimensione dello spazio tra le colonne. Non può essere negativo, ma può essere uguale a 0.
normalIndica l'uso dello spazio tra le colonne predefinito definito dal browser. Nel maggior parte dei browser, il valore predefinito è 1em.
initialImposta questa proprietà al suo valore predefinito.
inheritSe specificato, l'elemento correlato adotta il valore dell'attributo column-gap del suo elemento padre.

Compatibilità del browser

La compatibilità del browser con l'attributo column-gap è riportata nella seguente tabella; i numeri indicano la versione minima del browser che supporta l'attributo; tutti i browser mainstream supportano questa proprietà.

  • Firefox 2+ -moz-

  • Google Chrome 4+ -webkit-

  • Internet Explorer 10+

  • Apple Safari 3.1+ -webkit-

  • Opera 11.1+ -o-, 15+ -webkit-

Per ulteriori letture

Ecco come consultare i seguenti tutorial:Layout a più colonne del CSS3.

Proprietà correlate:column-width,column-fill,column-rule,column-rule-width,column-rule-style,column-rule-color,column-span,column-count,columns.

Proprietà column-rule CSS3Proprietà column-fill CSS3