#2 Пишем свой Bootstrap с нуля | Классы колонок на Sass

Published: 13 June 2021
on channel: CodeQuest
2,182
102

Исходники к видео:
https://boosty.to/codequest/posts/4b8...

Подписывайся на альтернативные каналы:

— https://vk.com/codequest
— https://t.me/codequest

В прошлом уроке мы начали писать свою реализацию Bootstrap. И на данный момент у нас уже есть основа для сетки:

— класс контейнера
— ряда
— и гибкой колонки

Этого уже достаточно, чтобы создавать макеты с симметричными элементами в ряду. Но не позволяет нам размещать их более сложные конфигурации. Например, чтобы один элемент занимал 3 колонки, а другой 9.

Как вы знаете, в Bootstrap для этого существуют специальные классы с фиксированной шириной от .col-1 до .col-12, соответственно.

В этом уроке мы с вами также создадим эти классы, используя возможности препроцессора Sass.

0:00 - Вступление
1:04 - Создание переменных
2:27 - Класс ".col-1"
2:54 - Расчет ширины одной колонки
4:55 - Выносим общую часть колонок
5:10 - Класс ".col-2"
5:47 - Миксин для колонок
6:38 - Генерируем классы колонок через @for
7:43 - Использование нашей сетки
8:34 - Послесловие

#bootstrap #sass #flexbox

Если тебе интересна данная тематика, подпишись на канал!
Для меня это также станет дополнительным стимулом продолжать свою работу.

Также жду вас на моем сайте https://codequest.ru
Здесь вы найдете подробные интерактивные курсы по веб-разработке.


Watch video #2 Пишем свой Bootstrap с нуля | Классы колонок на Sass online without registration, duration hours minute second in high quality. This video was added by user CodeQuest 13 June 2021, don't forget to share it with your friends and acquaintances, it has been viewed on our site 2,182 once and liked it 102 people.