0.00
0 читателей, 1 топик

Используем CSS Flexible Box Layout Module. Часть 1: Введение

В данной статье мы рассмотрим использование модели CSS Flex Box, предназначенной для дизайна пользовательского интерфейса в браузере. В этой модели дети контейнера flex (гибкий) могут располагаться в любом направлении, адаптируя свои размеры: расти, чтобы занять неиспользуемое место или сжиматься, чтобы предотвратить переполнение родительского элемента. Можно легко перемещать детей по вертикальной и горизонтальной оси. Возможность вложения контейнеров flex друг в друга (по горизонтальной оси внутри вертикальной и наоборот) позволяет создавать макеты в двух измерениях.

В CSS 2.1 есть 4 режима разметки — алгоритма, определяющего размер и позиции элементов на основе их отношений с соседними элементами:
  • блочная (block) разметка, спроектированная для документов;
  • inline разметка для текста;
  • табличная (table) разметка для 2D данных в табличном формате;
  • позиционная (positioned) разметка для явного позиционирования элементов без учета других в документе.
Этот модуль предоставляет новый режим разметки flex, спроектированный для сложных приложений и веб-страниц.

Читать дальше →