Первым делом давайте подключим jQuery framework, который необходим для работы с bootstrap, да и сейчас мало какие сайты работают без него.
У нас есть 2 способо добавления jQuery к нам на сайт. Сначала идем на сайт jquery.com и и скачиваем последнюю версию jquery, как показано на скриншоте. Сохраняем в папку js
Скачиваем jQuery
Теперь нам нужно подключить данный файл
<script src="js/jquery-1.11.0.min.js"></script>
Напомню, что есть еще второй способ подключения jQuery, это через CDN — Сеть доставки (и дистрибуции) контента (англ. Content Delivery Network или Content Distribution Network, CDN)
<script src="https://code.jquery.com/jquery-1.11.0.min.js"></script>
Для этого просто задаем полный пусть до jQuery на их сайте. Такие CDN есть еще у гугла и в некоторых других местах.
Лично я использую 1 способ, т.к. люблю, когда все хранится на моем компьютере. А то, если отключат интернет, то jQuery не будет работать, либо будет не доступен сам jquery.com
Второй же способ лучше тем, что если человек уже на каком-нибудь сайте загрузил данный файл, то на нашем ему уже не нужно будет этого делать, что экономит время и трафик. Так что сами выбирайте более понравившийся способ.
Давайте теперь подключим файл bootstrap.min.js
<script src="js/bootstrap.min.js"></script>
А теперь давайте подключим еще один файл, который отвечает за работоспособность bootstrap в разных браузерах. Особенно в старых IE. Скачать его можно перейдя по ссылке.
И давайте его подключим сразу
<script src="js/respond.min.js"></script>
И так, давайте посмотрим, что в конечном итоге у нас получилось
<!doctype html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>My Website</title> <link href="css/bootstrap.min.css" rel="stylesheet"> <link href="css/custom.min.css" rel="stylesheet"> <script src="js/respond.min.js"></script> <script src="js/jquery-1.11.0.min.js"></script> <script src="js/bootstrap.min.js"></script> </head> <body> </body> </html>
Полностью рабочуюсборку можно сказать здесь