Bootstrap-4 - шпаргалка
Обычное поведение
1
2
3
.row для родительского
1
2
3
.row и .col для дочернего (колонки рав. ширины)
1
3
1
2
3
1
2
3
4
5
.row, для доч. .col (авт.) .col-6 .col-2 (в сумме 12)
1
2
3
0
0
0
0
Поведение колонок при различных разрешених экрана
// Малые девайсы («ландшафтные телефоны», >= 576px) -sm
@media (min-width: 576px) { ... }
// Средние девайсы («таблетки», >= 768px) -md
@media (min-width: 768px) { ... }
// Большие девайсы (десктопы, >= 992px) -lg
@media (min-width: 992px) { ... }
// Экстрабольшие девайсы (большие десктопы, >= 1200px) -lg
@media (min-width: 1200px) { ... }
col-2-lg и .col-md-6
1 .col-md
2 .col-6
3 .col-lg-2
0
0
0
0
Веренос строки .w-100
1
2
3
4
--
1
2
--
1
2
--
1
2
3
align-items-center
1
2
3
align-self-start align-self-center align-self-end у доч.
1
2
3
justify-content-center
1
2
justify-content-around
1
2
justify-content-between
1
2
