Какие основные понятия CSS-флекса важны для веб-дизайна?

Некоторые основные понятия CSS-флекса, важные для веб-дизайна:

• Флекс-контейнер. doka.guide Элемент, к которому применяется свойство display: flex. doka.guide Вложенные в него элементы подчиняются правилам раскладки флексов. doka.guide
• Флекс-элемент. doka.guide Элемент, вложенный во флекс-контейнер. doka.guide
• Главная ось. htmlacademy.ru proweb63.ru Направление, в соответствии с которым располагаются все дочерние элементы флекс-контейнера. proweb63.ru По умолчанию течёт по горизонтали слева направо. htmlacademy.ru
• Поперечная ось. htmlacademy.ru proweb63.ru Направление, перпендикулярное главной оси. proweb63.ru Если главная ось горизонтальна, поперечная идёт сверху вниз, а если главная вертикальна, то поперечная направлена слева направо. htmlacademy.ru
• justify-content. htmlacademy.ru proweb63.ru CSS-свойство, которое распределяет элементы по главной оси. htmlacademy.ru Принимает следующие значения: flex-start, flex-end, center, space-between, space-around, space-evenly. htmlacademy.ru
• align-items. htmlacademy.ru proweb63.ru CSS-свойство, которое отвечает за выравнивание элементов по поперечной оси. htmlacademy.ru По умолчанию у него значение stretch, то есть элементы растягиваются вдоль всей оси. htmlacademy.ru
• flex-wrap. htmlacademy.ru Свойство, которое отвечает за перенос строк во флекс-контейнере. htmlacademy.ru По умолчанию у свойства стоит значение no-wrap, то есть перенос запрещён. htmlacademy.ru
• flex-basis. proweb63.ru Базовый размер отдельно взятого flex-блока. proweb63.ru Задаёт изначальный размер по главной оси для flex-блока до того, как к нему будут применены преобразования, основанные на других flex-факторах. proweb63.ru