Sisällysluettelo:

Mikä on Flexbox-säiliö?
Mikä on Flexbox-säiliö?

Video: Mikä on Flexbox-säiliö?

Video: Mikä on Flexbox-säiliö?
Video: Mikä on 2024, Joulukuu
Anonim

A joustava säiliö laajentaa kohteita täyttämään vapaan tilan tai kutistaa niitä ylivuodon estämiseksi. Mikä tärkeintä, flexbox asettelu on suuntaagnostinen toisin kuin tavalliset asettelut (pystysuoraan perustuva lohko ja vaakasuoraan pohjautuva inline).

Miten käytät Flexboxia tässä suhteessa?

Yhteenveto

  1. Käytä näyttöä: flex; luodaksesi joustavan säiliön.
  2. Käytä tasaussisältöä määrittääksesi kohteiden vaakasuuntaisen tasauksen.
  3. Käytä tasauskohteita määrittääksesi kohteiden pystysuuntaisen tasauksen.
  4. Käytä flex-directiona, jos tarvitset sarakkeita rivien sijaan.
  5. Käytä rivin käänteis- tai sarake-käänteisiä arvoja kääntääksesi nimikkeiden järjestyksen.

miten teet Flex-säiliön? Ennen kuin voit käyttää mitä tahansa flexbox ominaisuus, sinun on määritettävä a joustava säiliö ulkoasussasi. Sinä luo joustava säiliö asettamalla elementin näyttöominaisuuden johonkin flexbox asettelun arvot: flex tai inline- flex . Oletuksena, flex kohteet asetetaan vaakasuoraan pääakselille vasemmalta oikealle.

Mihin Flexboxia tällä tavalla käytetään?

Flexbox on asettelumalli, jonka avulla elementit voivat kohdistaa ja jakaa tilaa säilössä. Joustavilla leveyksillä ja korkeuksilla elementtejä voidaan kohdistaa täyttämään tilaa tai jakamaan tilaa elementtien välillä, mikä tekee siitä erinomaisen työkalun käyttää responsiiviset suunnittelujärjestelmät.

Mikä on oletussuunta Flex-säiliössä?

The oletuksena järjestely näytön asettamisen jälkeen: flex on tarkoitettu kohteiden järjestelemiseksi pääakselia pitkin vasemmalta oikealle. Alla oleva animaatio näyttää mitä tapahtuu milloin flex - suunta : -sarake lisätään kohtaan kontti elementti. Voit myös asettaa flex - suunta rivien käänteiseen ja sarakekäänteiseen.

Suositeltava: