Не получается сделать панель урок boostrap 19 задание navbar. помогите исправить?
Не получается сделать панель. Не вылазят ссылки, когда жмешь на кнопку в мобильной версии. В уроке boostrap 19 задание Navbar... Вроде даже весь код скопировал как в уроке а нет все равно жму ничего не происходит.
ИСХОДНЫЙ КОД
<body>
<div class="container-fluid">
<div class="row">
<nav role="navigation" class="navbar navbar-inverse">
<div class="container">
<div class="navbar-header">
<div class="container">
<div class="row">
<div class="col-lg-12">
<h1><a href="#">Киномонстер</a></h1>
<p>Кино наша страсть!!!</p>
</div>
</div>
</div>
<button type="button" data-target="#navbarCollapse" data-toggle="collapse" class="navbar-toggle">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div id="navbar-Collapse" class="collapse navbar-collapse navbar-right">
<ul class="nav nav-pills">
<li class="active"><a href="#">Главная</a></li>
<li><a href="#">Фильмы</a></li>
<li><a href="#">Сериалы</a></li>
<li><a href="#">Рейтинг фильмов</a></li>
<li><a href="#">Контакты</a></li>
</ul>
</div>
</div>
</nav>
</div>
</div>
3 ответов
Через CDN bootstrap подключите, как в примере ссылки на cdn сервера, вместо локального подключения bootstrap. У вас скорее всего javascript библиотеки bootstrap не подгрузились, вот и не работает меню :
https://getbootstrap.com/docs/3.3/getting-started/#download-cdn
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css">
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
Сравните ваш код с кодом из задания ниже, возможно опечатку допустили. И как в каком то из ответом писал Сергей, нужно соблюдать форматирование кода, тогда меньше ошибок будет:
https://fructcode.com/ru/courses/bootstrap/interactive-header-complete/
У меня такая же проблема. Код с урока скопировал, но всё равно не открываеться.