Сетка

Bootstrap включает в себя адаптивную, первую мобильную резиновую систему разметки, которая масштабируется до 12 столбцов как на устройствах или при изменении окна просмотра. Для того чтобы создавать разметку для всех видов устройств одновременно (мобильные-настольные-планшеты), нужно учитывать размер экрана каждого из устройств, и соответственно для каждого устройства задавать поведение «схлопываения». Достигается это специальными тегами, каждый из которых «работает» в зависимости от размеров экрана, согласно таблице:

Очень маленькие устройство Телефоны (<768px) Малые устройстваПланшеты (≥768px) Средние устройстваНастольные (≥992px) Большие устройстваНастольные (≥1200px)
Поведение разметки Горизонтальный все время Терпеть неудачу при начатии, горизонтальный выше контрольной точки
Ширина контейнера Нет (автом.) 750px 970px 1170px
Класс префикса .col-xs- .col-sm- .col-md- .col-lg-
# колонок 12
Ширина колонки Авто 60px 78px 95px
Промежуточная ширина 30px(15px) на каждой стороне колонки
Вкладка Да
Отступ Да
Выравнивание колонки Да

Вот названия и разметка сетки:

 

Вот пример «резиновых блоков»:

яя8

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Этот сайт использует Akismet для борьбы со спамом. Узнайте, как обрабатываются ваши данные комментариев.