Мазмуну:

Flexbox контейнер деген эмне?
Flexbox контейнер деген эмне?

Video: Flexbox контейнер деген эмне?

Video: Flexbox контейнер деген эмне?
Video: Docker и Kubernetes 🐳 / Что такое контейнеры и зачем они нужны? 2024, Май
Anonim

А ийкемдүү контейнер жеткиликтүү бош мейкиндикти толтуруу үчүн нерселерди кеңейтет же толуп кетпеш үчүн аларды кичирейтет. Эң негизгиси, flexbox макет кадимки макеттерге (вертикалдуу негизделген блок жана горизонталдуу негизделген) каршы багыт-агностикалык болуп саналат.

Буга байланыштуу, сиз Flexboxду кантип колдоносуз?

Жыйынтык

  1. Дисплейди колдонуңуз: flex; ийкемдүү контейнерди түзүү.
  2. Элементтердин горизонталдуу тегиздөөсүн аныктоо үчүн justify-content колдонуңуз.
  3. Элементтердин вертикалдуу тегиздөөсүн аныктоо үчүн align-items колдонуңуз.
  4. Саптардын ордуна мамычалар керек болсо, ийкемдүү багытты колдонуңуз.
  5. Нерсенин тартибин которуу үчүн сапка тескери же тилкеге тескери маанилерди колдонуңуз.

Flex контейнерди кантип жасайсыз? Кандайдыр бир колдонуудан мурун flexbox мулк, сиз а аныктоо керек ийкемдүү контейнер сиздин макетиңизде. сен ийкемдүү контейнер түзүү элементтин дисплей касиетин бирине коюу менен flexbox жайгашуу баалуулуктары: ийкемдүү же inline- ийкемдүү . Демейки боюнча, ийкемдүү заттар солдон оңго негизги огунда туурасынан жайгаштырылат.

Ушундай жол менен, Flexbox эмне үчүн колдонулат?

Flexbox элементтерге контейнер ичиндеги мейкиндикти тегиздөө жана бөлүштүрүү мүмкүнчүлүгүн берген макет модели. Ийкемдүү кеңдикти жана бийиктикти колдонуу менен элементтер мейкиндикти толтуруу же элементтердин ортосундагы мейкиндикти бөлүштүрүү үчүн тегизделиши мүмкүн, бул аны эң сонун курал кылат. үчүн колдонуу жооп дизайн системалары.

Flex контейнеринин демейки багыты кандай?

The демейки дисплейди колдонгондон кийин тартип: ийкемдүү негизги огу боюнча солдон оңго жайгаштырылган нерселер үчүн. Төмөнкү анимация качан эмне болорун көрсөтөт ийкемдүү - багыт : тилкеге кошулат контейнер элемент. Сиз да болот ийкемдүү коюу - багыт сапты тескери жана мамычаны тескери.

Сунушталууда: