loader

Cвойство flex это сокращённое свойство, определяющее способность гибкого элемента растягиваться или сжиматься для заполнения собой доступного свободного пространства. Это свойство устанавливает flex-grow, flex-shrink и flex-basis.

flex հատկությունը flex-grow, flex-shrink և flex-basis հատկությունների կրճատ տեսակն է, որը սահմանում է ճկուն տարրի կարողությունը ձգվել կամ նեղանալ՝ հասանելի ազատ տարածությունը լրացնելու համար:

Синтаксис

Գրելաձև

flex: none; ⟿ Без значения: 0 0 auto
flex: 2; ⟿ Одно значение, число без единиц: flex-grow
flex: 30px; ⟿ Одно значение, ширина/высота: flex-basis
flex: 2 30px; ⟿ Два значения: flex-grow | flex-basis
flex: 2 2; ⟿ Два значения: flex-grow | flex-shrink
flex: 2 2 30px; ⟿ Три значения: flex-grow | flex-shrink | flex-basis
flex: none; ⟿ Առանց արժեքի: 0 0 auto
flex: 2; ⟿ Մեկ արժեք, առանց միավորների: flex-grow
flex: 30px; ⟿ Մեկ արժեք, լայնություն/բարձրություն: flex-basic
flex: 2 30px; ⟿ Երկու արժեք: flex-grow | flex-basic
flex: 2 2; ⟿ Երկու արժեք: flex-grow | flex-shrink
flex: 2 2 30px; ⟿ Երեք արժեք: flex-grow | flex-shrink | flex-basis

Пример

Օրինակ

See the Pen flex by Erik Egnatosyan (@SansaciaCodenyx) on CodePen.

⇓Результат данного примера показан на рисунке⇓

⇓Այս օրինակի արդյունքը ցույց է տրված նկարում⇓

flex image

Также у тега flex есть следующие под. теги

Поддержка браузера дляԲրաուզերի աջակցությունը flex элемента տարրին
Browser IE Edge Chrome Firefox Safari Opera
Version 11+ 12+ 29+ 28+ 9+ 17+
Notes