Exemple
Réarranger la direction des éléments flexibles à l' intérieur du <div> élément:
document.getElementById("main").style.flexDirection = "column-reverse"; Essayez vous - même » Définition et utilisation
Les ensembles de propriétés de flexDirection ou retourne la direction des éléments flexibles.
Note: Si l'élément n'est pas un élément flexible, la propriété flexDirection n'a pas d' effet.
Support du navigateur
La propriété flexDirection est pris en charge dans IE10 +, Firefox, Opera et Chrome.
Remarque: Safari 6.1+ prend en charge une alternative, la propriété WebkitFlexDirection.
Syntaxe
Retour la propriété flexDirection:
object .style.flexDirectionDéfinissez la propriété flexDirection:
object .style.flexDirection="row|row-reverse|column|column-reverse|initial|inherit"
Valeurs de propriété
| Valeur | La description |
|---|---|
| row | Valeur par défaut. Les éléments flexibles sont affichés horizontalement, comme une rangée |
| row-reverse | Identique à la ligne, mais dans l'ordre inverse |
| column | Les éléments flexibles sont affichées verticalement, comme une colonne |
| column-reverse | Identique à la colonne, mais dans l'ordre inverse |
| initial | Définit cette propriété à sa valeur par défaut. Lisez à propos initial |
| inherit | Hérite cette propriété de son élément parent. En savoir plus sur hériteront |
Détails techniques
| Valeur par défaut: | rangée |
|---|---|
| Valeur de retour: | Une chaîne, ce qui représente la propriété de direction de flexion d'un élément |
| version CSS | CSS3 |
Pages associées
Référence CSS: la flex-direction property
HTML DOM STYLE Référence: flex property
HTML DOM STYLE Référence: flexBasis property
HTML DOM STYLE Référence: flexFlow property
HTML DOM STYLE Référence: flexGrow property
HTML DOM STYLE Référence: flexShrink property
HTML DOM STYLE Référence: flexWrap property
<Style objet