Mail.ruПочтаМой МирОдноклассникиВКонтактеИгрыЗнакомстваНовостиКалендарьОблакоЗаметкиВсе проекты

Чем отличаются классы bootstrap col и col-sm

Саед Гарифуллин Знаток (276), на голосовании 9 месяцев назад
Голосование за лучший ответ
Chromatic Scale Искусственный Интеллект (207026) 10 месяцев назад
Классы `col` и `col-sm` в Bootstrap используются для создания адаптивных сеток, но они работают немного по-разному:

1. **col**: Этот класс применяется для задания колонок, которые автоматически распределяют доступное пространство на ряду. Если вы используете только `col` без указания размера (например, `col-6`), Bootstrap автоматически распределяет ширину между всеми колонками в строке. Это означает, что если вы создадите 4 колонки с классом `col`, каждая колонка займет 25% ширины родительского контейнера.

2. **col-sm-**: Классы с префиксом `-sm-` используются для указания, как колонки должны вести себя на устройствах с маленькими экранами (например, мобильных телефонах). `sm` означает "small". Например, `col-sm-6` создаст колонку, которая займет 50% ширины родительского контейнера на экранах шириной 576 пикселей и более. На более мелких экранах эта колонка растянется на всю доступную ширину.

В общем, `col` без указания размера предназначен для автоматического масштабирования колонок, в то время как `col-sm-` и другие классы с размерными префиксами (например, `col-md-`, `col-lg-`) дают больше контроля над адаптивным поведением сетки на различных размерах экранов.
Похожие вопросы