Верстка сайтов с Bootstrap 4

Bootstrap 4 - это библиотека, которая упрощает верстку веб-сайтов благодаря готовым компоннтам и grid system. В Bootstap версии 4 используется flexbox, а это значит, что Bootstrap версии четыре гибче третьей версии

Верстка сайтов с Bootstrap 4
14 уроков14 уроков
СертификатСертификат
РусскийРусский
FructCode

Описание:

Bootstrap 4 содержит готовые css-классы и компоненты, благодаря которым, вы очень быстро сможете сделать, например, красивую форму входа на сайт, карусель для фотографий, красивые кнопки и многое другое.
В уроках Bootstrap 4 вы узнаете:

  • Как верстать блоки на сайте с помощью Grid System
  • Что такое Flexbox и как Flexbox упрощает позиционирование блоков
  • Чем Bootstrap 4 отличается от Bootstrap 3
  • Какие существуют компоненты в Bootstrap 4
  • Как быстро встроить Bootstrap 4 в html-страницу или веб-сайт
  • Как установить Bootstrap 4 с помощью NodeJS и NPM
  • Как добавлять к элементам сайта подсказки
  • Как за 2 минуты создать галерею изображений или товаров на сайте
  • Как программировать поведение компонентов с помощью Javascript и jQuery
  • Как сделать модальное окно на сайте с помощью Bootstrap 4
  • Как создавать верстку страниц с помощью Bootstrap 4

Используя Bootstrap 4, компоненты адаптируются как к большим экранам десктоп-компьютеров, так и к маленьким экранам мобильных телефонов. 

Программа курса:

Знакомство с Bootstrap 4 и установка

  • Знакомство с Bootstrap 4
  • Как проходить курс Bootstrap 4 и необходимые знания
  • Как установить Bootstrap 4

Позиционирование блоков (Grid System)

  • Grid system: классы container и container-fluid
  • Практическое упражнение: container и container-fluid
  • Grid system: Примеры использования сетки Bootstrap 4
  • Практическое упражнение Grid System
  • Grid system: Примеры использования сетки Bootstrap 4. Продолжение.
  • Flex позиционирование justify-content и align-items
  • Практическое упражнение Flex justify-content и align-items

Компоненты Bootstrap 4

  • Знакомство с компонентами Bootstrap 4
  • Практическое упражнение: Компоненты Bootstrap 4