English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
L'attributo CSS flex-wrap specifica se forzare i componenti flex in una riga o distribuirli su più righe o colonne in base allo spazio disponibile nel contenitore flex.
La tabella seguente fornisce la descrizione dell'uso e la cronologia delle versioni di questa proprietà, nonché la sintassi di utilizzo di questa proprietà nel linguaggio JavaScript.
| Valore predefinito: | nowrap |
|---|---|
| Applicabile a: | Contenitore flessibile |
| Ereditarietà: | No |
| Animabile: | No.Si prega di consultare Attributi animazione. |
| Versione: | Nuove funzionalità del CSS3 |
| JavaScript syntax: | oggetto.style.flexWrap="wrap-reverse" |
La sintassi di questo attributo è la seguente:
flex-wrap: nowrap | wrap | wrap-reverse | initial | inherit
L'esempio seguente dimostra come utilizzare la proprietà flex-wrap.
.flex-container {
/* Safari */
display: -webkit-flex;
-webkit-flex-wrap: nowrap;
display: flex;
flex-wrap: nowrap;
}Testa per vedere‹/›La tabella sottostante descrive i valori di questa proprietà.
| Valore | Descrizione |
|---|---|
| nowrap | Valore predefinito. Specificare che i componenti flessibili non vengano divisi in righe o colonne. |
| wrap | Specificare se necessario, i componenti elastici saranno divisi in più righe. |
| wrap-reverse | Come wrap, ma gli elementi si rigireranno in ordine inverso. |
| initial | Imposta questa proprietà al suo valore predefinito. |
| inherit | Se specificato, l'elemento correlato adotta il valore della proprietà flex-wrap del suo elemento padre. |
La compatibilità del browser con la proprietà flex-wrap, i numeri nella tabella sotto 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,flex-basis,flex-direction,flex-flow,flex-grow,flex-shrink,justify-content,min-height,min-width,order.