Несколько способов создания структурированного контента с помощью колонок:
- С помощью плавающих блоков. 2 По умолчанию два блока в нормальном потоке не могут стоять на одной строке, но это поведение можно изменить, прописав обоим свойство
float: left | right
. 2 Они начнут прижиматься к левому или правому краю. 2 - С помощью таблиц. 2 Таблицы созданы для вывода большого количества ячеек и столбцов, поэтому сделать в них колонки проще всего. 2 Вся структура задаётся в HTML-коде, поэтому код получается достаточно громоздким. 2
- С помощью флексбокса. 2 Создаётся один общий блок-контейнер, в который помещаются другие блоки, которые нужно сделать в виде колонок. 2 Потом этому контейнеру нужно прописать
display: flex
. 2 - С помощью CSS. 2 CSS предлагает возможность разбить текст в основном блоке без помощи плавающих блоков, таблиц или флексбоксов. 2 Для этого используются свойства:
column-count
(задает количество колонок, на которое нужно разбить текст), column-width
(задает количество символов текста в одной колонке), column-gap
(определяет промежуток между колонками) и column-rule
(рисует линию, разделяющую колонки). 2
Выбор способа зависит от конкретных требований проекта. 4