Bootstrap - Общая информация:

Подключение Bootstrap версии 4.0.0

Добавьте в ваш HTML файл, в раздел "<head>" следующий код:

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0/css/bootstrap.min.css">

А так-же, в самый конец HTML файла, перед закрывающимся тегом "</body>" следующий код:

<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0/js/bootstrap.min.js"></script>

Обратите внимание! Данный скрипт должен стоять ОБЯЗАТЕЛЬНО после скрипта подключения "jquery.min.js".

Стандартная сетка Bootstrap'а - 12 колонок.
Структура: Контейнер -> Строка -> Колонка.
(... примеры сеток ...)

Cуществуют следующие классы для контейнеров:

container - Это стандартный контейнер с отступами
container-fluid - Это контейнер без отступов (флюидеый, тянущийся)

Breakpoint или Ключевые точки или Точки слома:

Стандартная ширина окна 1920 px - при этом Ширина контейенра = 1170 px
№1 - 1200 px - при этом Ширина контейенра = 970 px
№2 - 992 px - при этом Ширина контейенра = 750 px
№3 - 768 px - при этом Ширина контейенра - Плавающая. Контейнер растягивается на 100% ширины родителя.

Подключение трех стилей: Bootstrap, Font-awesome и нашего основного Main

<link rel="stylesheet" href="css/bootstrap.css">

<link rel="stylesheet" href="css/font-awesome.min.css">

<link rel="stylesheet" href="css/main.css">