Παράμετρος flex-wrap του CSS

  • προηγούμενη σελίδα flex-shrink
  • επόμενη σελίδα float

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

Η ιδιότητα flex-wrap καθορίζει αν οι ελαστικοί αντικειμένων θα γραμμοποιηθούν.

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

Δείτε επίσης:

Εκμάθηση CSS: Ελαστική κουτί CSS

Εγχειρίδιο CSS:Ιδιότητα flex

Εγχειρίδιο CSS:Ιδιότητα flex-basis

Εγχειρίδιο CSS:Ιδιότητα flex-direction

Εγχειρίδιο CSS:Ιδιότητα flex-flow

Εγχειρίδιο CSS:Ιδιότητα flex-grow

Εγχειρίδιο CSS:Ιδιότητα flex-shrink

Εγχειρίδιο HTML DOM:Ιδιότητα flexWrap

Παράδειγμα

Γραμμοποιήστε τους ελαστικούς αντικειμένων ανάλογα με την ανάγκη:

div {
  display: flex;   
  flex-wrap: wrap;
}

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

Γλώσσα CSS

flex-wrap: nowrap|wrap|wrap-reverse|initial|inherit;

Τιμή ιδιότητας

Τιμή Περιγραφή
nowrap Προεπιλεγμένη τιμή. Καθορίζει ότι οι ελαστικοί αντικειμένων δεν θα γραμμοποιηθούν.
wrap Καθορίζει ότι οι ελαστικοί αντικειμένων θα γραμμοποιηθούν ανάλογα με την ανάγκη.
wrap-reverse Καθορίζει ότι οι ελαστικοί αντικειμένων θα γραμμοποιηθούν ανάλογα με την ανάγκη, σε αντίθετη κατεύθυνση.
initial Ρυθμίστε αυτή την ιδιότητα στην προεπιλεγμένη της τιμή. Δείτε: initial.
inherit Κληρονομείται αυτή η ιδιότητα από το γονικό στοιχείο. Δείτε: inherit.

Τεχνικά λεπτομέρειες

Προεπιλεγμένη τιμή: nowrap
Κληρονομικότητα: Όχι
Προσαρμογή animation: Δεν υποστηρίζεται. Δείτε:Αξιοθέατα animation.
Έκδοση: CSS3
Γλώσσα JavaScript: object.style.flexWrap="nowrap"

Υποστήριξη περιηγητή

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

Τα αριθμητικά που περιέχουν -webkit- ή -moz- δείχνουν την πρώτη έκδοση που χρησιμοποιεί το πρόθεμα.

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
  • προηγούμενη σελίδα flex-shrink
  • επόμενη σελίδα float