| иконка | теги | |
|---|---|---|
столбцы |
|
Компонент "Столбец" используется для создания нескольких столбцов с равной шириной и заголовком для каждого столбца.
Компонент "Столбец" настраивается путем обрамления любого блока контента в открывающие и закрывающие ||| и установкой заголовка для каждой столбца.
Колонка может содержать любой другой контент, такой как текст, абзацы, ссылки, таблицы, изображения и другие компоненты Docsinum.
||| Столбец 1
Это абзац внутри **столбца**.
|||||| Столбец 1 Это абзац внутри столбца. |||
!!! Для каждого столбца требуется указать заголовок. Заголовок отделяется одним пробелом от открывающего |||, например, ||| Столбец 1. !!!
Один или несколько столбцов могут быть настроены путем стекирования нескольких блоков столбцов.
||| Столбец 1
Содержимое 1
||| Столбец 2
Содержимое 2
||| Столбец 3
Содержимое 3
|||||| Столбец 1 Содержимое 1 ||| Столбец 2 Содержимое 2 ||| Столбец 3 Содержимое 3 |||
Возможно использование неограниченного количества столбцов, хотя практический предел будет определяться шириной области содержимого страницы.
Все столбцы будут иметь одинаковую ширину, и нет опции конфигурации для создания столбцов с переменной шириной.
Создается специальный столбец с кодом, когда блок кода настроен внутри столбца и единственное содержимое столбца - это блок кода. В следующем примере показана 2-колоночная компоновка с блоком кода во второй колонке.
||| Пример
[!button Кнопка](button.md)
||| Исходный код
```md
[!button Кнопка](button.md)
```
|||
||| Пример !button Кнопка ||| Исходный код
[!button Кнопка](button.md)|||
Если внутри столбца есть другое содержимое, столбец и блок кода будут отображаться как обычно. Например, добавим некоторый текст во вторую колонку и посмотрим на разницу:
||| Пример
[!button Кнопка](button.md)
||| Исходный код
Внутри этой колонки находится компонент кнопки.
```md
[!button Кнопка](button.md)
```
|||
||| Пример !button Кнопка ||| Исходный код Внутри этой колонки находится компонент кнопки.
[!button Кнопка](button.md)|||
Заголовки столбцов поддерживают настройку с помощью Markdown, поэтому можно добавлять ссылки, emojis или icons.
||| Заголовок с эмодзи :thumbsup:
Заголовок столбца с [эмодзи](emoji.md) `:thumbsup:`.
||| Заголовок с иконкой :icon-check-circle:
Заголовок столбца с [иконкой](icon.md) `:icon-check-circle:`.
|||
||| Заголовок с эмодзи 👍
Заголовок столбца с эмодзи 👍.
||| Заголовок с иконкой :icon-check-circle:
Заголовок столбца с иконкой :icon-check-circle:.
|||