CSS flex-flow ιδιότητα

Ορισμός και χρήση

Η ιδιότητα flex-flow είναι συντομευμένη μορφή των παρακάτω ιδιοτήτων:

Σημειώσεις:Αν το στοιχείο δεν είναι ελαστική μονάδα, η ιδιότητα flex είναι άκυρη.

Επίσης δείτε:

CSS ΕκμάθησηCSS Ελαστικός πίνακας

Ειδικές ιδιότητεςΕιδικές ιδιότητες

Ειδικές ιδιότητεςΕιδικές ιδιότητες

Ειδικές ιδιότητεςΕιδικές ιδιότητες

Ειδικές ιδιότητεςΕιδικές ιδιότητες

Ειδικές ιδιότητεςΕιδικές ιδιότητες

Ειδικές ιδιότητεςΕιδικές ιδιότητες

Ειδικές ιδιότητεςHTML DOM Εγχειρίδιο

Ειδικές ιδιότητες

Παράδειγμα

Εμφανίστε τις ελαστικές μονάδες σε αντίστροφη κατεύθυνση και μετακινήστε τις σε νέα γραμμή ανάγκης:
  div {
  display: flex;
flex-flow: row-reverse wrap;

}

Προσπαθήστε μόνοι σας

Γλώσσα CSS

flex-flow: flex-direction flex-wrap|initial|inherit;

Τιμή ιδιότητας Τιμή
flex-direction

flex-wrap

  • Περιγραφή
  • row
  • row-reverse
  • column
  • Αναθέστε αυτή την ιδιότητα στην προεπιλεγμένη της τιμή. Δείτε επίσης:
  • Απόκτηση από το γονικό στοιχείο του.

column-reverse

Η προεπιλεγμένη τιμή είναι "row".
Καθορίζει την κατεύθυνση της ελαστικής μονάδας.

flex-wrap

  • Πιθανές τιμές:
  • nowrap
  • wrap
  • Αναθέστε αυτή την ιδιότητα στην προεπιλεγμένη της τιμή. Δείτε επίσης:
  • Απόκτηση από το γονικό στοιχείο του.

wrap-reverse

Η προεπιλεγμένη τιμή είναι "nowrap".
Αναθέστε αυτή την ιδιότητα στην προεπιλεγμένη της τιμή. Δείτε επίσης: Καθορίζει αν η ελαστική μονάδα πρέπει να μετακινείται σε νέα γραμμή. Αναθέστε αυτή την ιδιότητα στην προεπιλεγμένη της τιμή. Δείτε επίσης:Παράμετροι αναπαραγωγής
Απόκτηση από το γονικό στοιχείο του. initial Απόκτηση από το γονικό στοιχείο του.Παράμετροι αναπαραγωγής

inherit

Τεχνικές λεπτομέρειες Προεπιλεγμένη τιμή:
row nowrap Κληρονομικότητα:
Όχι Παραγωγή αναπαραγωγής:Μη υποστηριζόμενο. Δείτε επίσης:Παράμετροι αναπαραγωγής
。 Έκδοση:
CSS3 Γλώσσα JavaScript:

object.style.flexFlow="column nowrap"

Η υποστήριξη του περιηγητή

Τα αριθμά του πίνακα δείχνουν την πρώτη έκδοση του περιηγητή που υποστηρίζει πλήρως την ιδιότητα.

Chrome IE / Edge Firefox Safari Opera
29.0
21.0 -webkit-		 11.0 28.0
18.0 -moz-		 9.0
6.1 -webkit-		 17.0