Exemplu
Liniile Pack spre centrul containerului flexibil:
div
{
width: 70px;
height: 300px;
border: 1px solid #c3c3c3;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-align-content: center;
align-content: center;
}
Încearcă - l singur » Definiție și utilizare
Proprietatea Alinierii conținut modifică comportamentul de proprietate flex-wrap. Este similar cu alinia-elemente, dar în loc de aliniere elemente flex, se aliniază liniile de flex.
Sfat: Folosiți justificarea conținut de proprietate pentru a alinia elementele de pe principala axa (horizontally) .
Notă: Trebuie să existe mai multe linii de articole pentru această proprietate să aibă nici un efect.
| Valoare implicită: | stretch |
|---|---|
| Mostenit: | no |
| Animatable: | no. Read about animatable |
| Versiune: | CSS3 |
| sintaxa JavaScript: | object .style.alignContent="center" Try it |
Suport pentru browser-
Numerele din tabel specifica prima versiune de browser care acceptă pe deplin proprietatea.
Numerele urmate de -webkit- specifica prima versiune care a lucrat cu un prefix.
| Proprietate | |||||
|---|---|---|---|---|---|
| align-content | 21.0 | 11.0 | 28.0 | 9 7.0 -webkit- | 12.1 |
CSS Sintaxa
align-content: stretch|center|flex-start|flex-end|space-between|space-around|initial|inherit;Valori de proprietate
| Valoare | Descriere | Joaca-l |
|---|---|---|
| stretch | Valoare implicită. Liniile se întind pentru a prelua spațiul rămas | Joaca - l » |
| center | Liniile sunt ambalate spre centrul containerului flexibil | Joaca - l » |
| flex-start | Liniile sunt ambalate spre începutul containerului flexibil | Joaca - l » |
| flex-end | Liniile sunt ambalate spre capătul containerului flexibil | Joaca - l » |
| space-between | Liniile sunt distribuite uniform în container flexibil | Joaca - l » |
| space-around | Liniile sunt distribuite uniform în container flexibil, cu spații de jumătate de dimensiune la fiecare capăt | Joaca - l » |
| initial | Setează această proprietate la valoarea implicită. Citiți despre inițială | Joaca - l » |
| inherit | Mosteneste această proprietate de la elementul părinte. Citiți despre moștenesc |
Pagini similare
CSS Referință: align-items property de align-items property
CSS Referință: align-self property
CSS Referință: justify-content property
HTML DOM referință: alignContent property