CSS joustavuus pyöriä ominaisuus

Määrittely ja käyttö

flex-wrap-ominaisuus määrittelee, tulisiko joustavat komponentit vaihtaa rivejä.

Huomautus:Jos elementti ei ole joustava komponentti, flex-ominaisuus on voimaton.

Lisäksi:

CSS-opetus: CSS-joustavuuskehys

CSS -viittausoppas:flex-ominaisuus

CSS -viittausoppas:flex-basis-ominaisuus

CSS -viittausoppas:flex-direction-ominaisuus

CSS -viittausoppas:flex-flow-ominaisuus

CSS -viittausoppas:flex-grow-ominaisuus

CSS -viittausoppas:flex-shrink-ominaisuus

HTML DOM -viittausoppas:flexWrap-ominaisuus

Esimerkki

Vaihda joustavat komponentit riveille tarvittaessa:

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

Kokeile itse

CSS-kieli

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

Ominaisuusarvo

Arvo Kuvaus
nowrap Oletusarvo. Määrittelee, että joustavat komponentit eivät vaihda rivejä.
wrap Määrittelee, että joustavat komponentit vaihtavat rivejä tarvittaessa.
wrap-reverse Määrittelee, että joustavat komponentit vaihtavat rivejä tarvittaessa, vastakkaisessa suunnassa.
initial Aseta tämä ominaisuus sen oletusarvon arvoon. Katso: initial.
inherit Perii tämän ominaisuuden isältään. Katso: inherit.

Tekninen yksityiskohta

Oletusarvo: nowrap
Perintä: Ei
Animaation tekeminen: Ei tuettu. Katso:Animaatiot.
Versio: CSS3
JavaScript-kieli: object.style.flexWrap="nowrap"

Selaimen tuki

Taulukossa olevat numerot osoittavat ensimmäisen selaimen version, joka tukee tätä ominaisuutta täysin.

Numerot, jotka sisältävät -webkit- tai -moz-, osoittavat ensimmäisen version, jota etuliite käytetään.

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