English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
Quando ci sono spazi in eccesso sull'asse orizzontale (verticale), l'attributo CSS può allineare gli elementi all'interno del contenitore elastico. Questa proprietà non ha alcun effetto sui contenitori elastici a singola riga. Inoltre, puoi utilizzare CSS justify-contentL'attributo allinea gli elementi sull'asse principale.
La tabella seguente riassume l'ambito di applicazione e la cronologia delle versioni di questo attributo.
| Valore predefinito: | stretch |
|---|---|
| Applicabile a: | Contenitore elastico a multilinea |
| Ereditarietà: | Nessuno |
| Animabile: | No.Vedere: Proprietà animazione。 |
| Versione CSS: | Nuova funzionalità CSS3 |
| Sintassi JavaScript: | object.style.alignContent="center" |
La sintassi di questa proprietà è la seguente:
align-content: center | flex-start | flex-end | space-between | space-around | stretch | initial | inherit
Il seguente esempio mostra come utilizzare la proprietà align-content del CSS.
.flex-container {
/* Safari浏览器 */
display: -webkit-flex;
-webkit-flex-flow: row wrap;
-webkit-align-content: space-around;
/* Grammatica standard */
display: flex;
flex-flow: row wrap;
align-content: space-around;
}Prova a vedere‹/›La tabella sottostante descrive i valori di questo attributo.
| Valore | Descrizione |
|---|---|
| center | L'elemento si trova al centro del contenitore flessibile. |
| flex-start | L'elemento si trova all'inizio del contenitore flessibile. |
| flex-end | L'elemento si trova all'estremità finale del contenitore flessibile. |
| space-between | L'elemento si distribuisce uniformemente nel contenitore flessibile per garantire che lo spazio tra due elementi adiacenti sia lo stesso. |
| space-around | L'elemento si distribuisce uniformemente nel contenitore flessibile per garantire che lo spazio intorno a ciascun elemento (cioè prima, tra e dopo) sia lo stesso. |
| stretch | Stira l'elemento per adattarlo al contenitore flessibile. Lo spazio disponibile viene distribuito uniformemente tra tutti gli elementi. Questo è il valore predefinito. |
| initial | Imposta questo attributo al suo valore predefinito. |
| inherit | Se specificato, l'elemento correlato adotta il valore calcolato dell'attributo align-content del suo elemento padre. |
Tutti i browser principali supportano l'attributo align-content. Il numero indica la versione del primo browser che supporta l'attributo.
|
Attenzione： Apple Safari 7 e versioni successive supportano l'attributo align-content, ma è necessario il prefisso -webkit-, ad esempio -webkit-align-content: center;
Esegui riferimento ai seguenti tutorial：Allineamento CSS。
Proprietà correlate：align-items，align-self，display，flex，flex-basis，flex-direction，flex-flow，flex-grow，flex-shrink，flex-wrap，justify-content，min-height，min-width，order。