English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
L'attributo flex CSS specifica i componenti della lunghezza elastica. È utilizzato per impostare contemporaneamenteflex-grow,flex-shrinkEflex-basisAbbreviazione della proprietà.
La tabella seguente fornisce la descrizione dell'uso e la cronologia delle versioni di questa proprietà, nonché la sintassi di utilizzo di questa proprietà nei script JavaScript.
| Valore predefinito: | 0 1 auto; Visualizza tutte le proprietà |
|---|---|
| Applicabile a: | Elementi elastici |
| Ereditarietà: | No |
| Animabile: | Sì, perché ogni attributo di abbreviazione è animabile.Si prega di consultare Proprietà di animazione. |
| Versione: | Nuove funzionalità del CSS3 |
| JavaScript syntax: | object.style.flex="1" |
La sintassi di questo attributo è la seguente:
flex: [ flex-grow flex-shrink flex-basis ] | none | auto | initial | inherit
Il seguente esempio dimostra come utilizzare la proprietà flex.
.flex-container {
-webkit-flex: 1; /* Safari 6.1+ */
-ms-flex: 1; /* IE 10 */
flex: 1;
}Prova a vedere‹/›La tabella sottostante descrive i valori di questa proprietà.
| Valore | Descrizione |
|---|---|
| flex-grow | Specificare il coefficiente di crescita elastico o la positiva elasticità dell'elemento elastico. |
| flex-shrink | Specificare il coefficiente di contrazione elastico o la negativa elasticità dell'elemento elastico. |
| flex-basis | Specificare la dimensione iniziale dell'elemento elastico. |
| none | Equivalente a impostare flex su 0 0 auto. |
| auto | Equivalente a impostare flex su 1 1 auto. |
| initial | Imposta questa proprietà al suo valore predefinito. |
| inherit | Se specificato, l'elemento correlato adotta il valore delle proprietà flex del suo elemento padre. |
Compatibilità dei browser per le proprietà flex, i numeri nella tabella sottostante rappresentano la versione minima del browser che supporta questa proprietà; tutti i browser mainstream supportano questa proprietà.
|
Si prega di consultare la seguente guida:Layout a più colonne del CSS3.
Proprietà correlate:align-content,align-items,align-self,display,flex-basis,flex-direction,flex-flow,flex-grow,flex-shrink,flex-wrap,justify-content,min-height,min-width,order.