| Kosten | Суббота, 21 Июля 2018, 21:08 | Сообщение 1 |
| Для того, что бы вы смогли разделить список с элементами или к примеру текст на несколько колонок, то вам безусловно нужно использовать свойство column-count. Так как при обновлении Div раздел столбцов этого кода больше не работает корректно. Вы все еще можете использовать стиль для своих сообщений, но чтобы изменить количество столбцов, я настоятельно рекомендую вам перейти к использованию CSS. Где вам предоставлен полностью рабочий рецепт по разделению списков.
Есть несколько способов сделать это, что даже можно сделать с PHP, но думаю мало кому нравится возиться, когда есть гораздо легкий и актуальный способ. Итак, это полностью CSS решение с некоторыми замечательными небольшими фрагментами, которые вы также сможете использовать в других местах.
CSS
Код .column {
-moz-column-count: 3;
-webkit-column-count: 3;
column-count: 3;
}
Здесь нужно понимать, что сами списки и комбинирование полей могут быть связанными, и также несвязанными элементами управления. Так как элементы управления могут искать значения в фиксированном списке, который вы вводите сами, или они могут искать значения в таблице или запросе.
Свойство CSS указывает идеальную ширину столбца в много колоночном макете. Контейнер будет иметь столько столбцов, сколько может, без каких-либо из них, имеющих ширину меньше значения. Это свойство может помочь вам создать гибкие конструкции, соответствующие различным размерам экрана. Особенно при наличии свойства column-count, которое имеет приоритет, вы должны указать все соответствующие значения длины для достижения точной ширины столбца.
Также можно раскидать по спискам:
HTML
Код <p class="content-box">
Здесь ваше описание
</p>
CSS
Код .content-box {
column-width: 293px;
}
Демонстрация
Указывает оптимальную ширину столбца, это фактическая ширина столбца может отличаться от заданного значения, так как она может быть более широкой, когда необходимо, чтобы заполнить свободное пространство, и уже, когда доступное пространство слишком мало. Значение должно быть строго положительным или объявление недействительно.
Также можете сделать перегородку по колонкам:
Все тоже самое, можно сказать антологичное, только при разделение текста на колонки, здесь мы еще добавляем дизайн. чтоб визуально красиво и понятно смотрелось.
HTML
Код <p>Здесь ваш текст</p>
CSS
Код p {
column-count: 3;
column-rule-style: solid;
column-rule-color: #168c10;
}
Демонстрация
Как можете видеть, что цвет сами самостоятельно можете выбрать пол свою стилистику сайта.
| | Страна: (RU) |
| |
