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

Manuale di riferimento CSS

Regole @ di CSS (RULES)

Completo della proprietà CSS

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

L'attributo CSS column-width specifica la larghezza ottimale delle colonne degli elementi multi-colonna. Questo non è un valore assoluto; il browser può adattare la larghezza delle colonne in base ai valori di altri attributi, in particolarecolumn-count.

La tabella sottostante fornisce la descrizione dell'uso di questa proprietà e la cronologia delle versioni, nonché la sintassi di utilizzo di questa proprietà nel linguaggio JavaScript.

Valore predefinito:auto
Applicabile a:Non sostituibileBloccoElemento (tranne gli elementi tabella), cella tabella eBlocco in lineaElemento
Ereditarietà:No
Animabile:Sì.Si prega di riferimento Attributi animazione.
Versione: Nuove funzionalità CSS3
JavaScript syntax:object.style.columnWidth="100px"

Sintassi dell'uso di column-width

La sintassi di questa proprietà è la seguente:

column-width:　length　|　auto　|　initial　|　inherit

Ecco un esempio di come utilizzare la proprietà column-width.

p　{
　　　　-webkit-column-width:　150px;　/*　Chrome,　Safari,　Opera　*/
　　　　　　　-moz-column-width:　150px;　/*　Firefox　*/
　　　　　　　　　　　　column-width:　150px;　
}
Prova a vedere‹/›

Valore dell'attributo

La tabella di seguito descrive i valori di questa proprietà.

ValoreDescrizione
length

Lunghezza espressa in unità assolute o relative, utilizzata per specificare la larghezza della colonna.

autoLa larghezza della colonna è determinata da altri valori delle proprietà degli elementi multi-columna, ad esempio column-Count. Questo è il valore predefinito.
initialImposta questa proprietà al suo valore predefinito.
inheritSe specificato, l'elemento correlato utilizza il valore della proprietà column-width del suo elemento padre.

Compatibilità del browser

La compatibilità del browser per la proprietà column-width è elencata di seguito; i numeri nella tabella rappresentano la versione minima del browser che supporta questa proprietà; 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-

Leggi di più

Ecco alcuni tutorial da consultare:Layout a più colonne CSS3.

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

Proprietà columns del CSS3Proprietà column-span CSS3