Switch slides in bootstrap

 .carousel-inner img { display: block; width: 600px; height: 500px !important; margin: 0 auto; } 

 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <div class="container"> <!-- Навигация --> <div class="navbar navbar-inverse navbar-static-top"> <div class="container"> <div class="navbar-header"> <!-- Кнопка отвечает за навигацию --> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#responsive-menu"> <span class="sr-only">Открыть навигацию</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="index.html"><img src="images/math.png" class="img-rounded" alt="Cinque Terre" width="104" height="36"></a> </div> <div class="collapse navbar-collapse" id="responsive-menu"> <ul class="nav navbar-nav"> <li><a href="#"><i class="fa fa-sign-in fa-1x" aria-hidden="true" ></i> Моя страница</a></li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">Материалы<b class="caret"></b></a> <ul class="dropdown-menu"> <li><a href="#"><i class="fa fa-circle-o-notch fa-1x" aria-hidden="true"></i> Наш курс</a></li> <li><a href="#"><i class="fa fa-circle-o-notch fa-1x" aria-hidden="true"></i> Статьи пользоватлей</a></li> <li class="divider"></li> <li><a href="#">Написать статью</a></li> </ul> </li> <li><a href="#">О нас</a></li> </ul> </div> </div> </div> <!-- Слайдер --> <div id="carousel" class="carousel slide"> <!-- Индикаторы слайдов --> <ol class="carousel-indicators"> <li class="active" data-target="#carousel" data-slide-to="0"></li> <li data-target="#carousel" data-slide-to="1"></li> <li data-target="#carousel" data-slide-to="2"></li> </ol> <!-- Слайды --> <div class="carousel-inner"> <div class="item active"> <img width="2000" height="800" class="cerousel-imeges" src="http://economictimes.indiatimes.com/thumb/msid-50941625,width-640,resizemode-4/mughal-gardens-in-full-bloom.jpg" alt=""> <div class="carousel-caption"> <blockquote> <p> Цитата </p> <footer><cite title="Source Title">Автора</cite></footer> </blockquote> </div> </div> <div class="item"> <img width="2000" height="800" class="cerousel-imeges" src="http://media.gettyimages.com/photos/cosmos-flowers-in-full-bloom-picture-id467213949?k=6&m=467213949&s=170667a&w=0&h=y5trnQg5YGRZ8hiJQdpHW3fI2QsyPk547IslOsA2zuQ=" alt=""> <div class="carousel-caption"> <blockquote> <p> Цитата </p> <footer><cite title="Source Title">Автор</cite></footer> </blockquote> </div> </div> <div class="item"> <img src="http://keenthemes.com/preview/metronic/theme/assets/global/plugins/jcrop/demos/demo_files/image1.jpg" alt=""> <div class="carousel-caption"> <blockquote> <p> В математике нет настоящих противоречий. </p> <footer><cite title="Source Title">Карл Фридрих Гаусс</cite></footer> </blockquote> </div> </div> <!-- Стрелки переключения слайдов --> <a href="#carousel" class="left carousel-control" data-slide="prev"> <span class="glyphicon glyphicon-chevron-left"></span> </a> <a href="#carousel" class="right carousel-control" data-slide="next"> <span class="glyphicon glyphicon-chevron-right"></span> </a> <!--<a href="#carousel" class="left carousel-control" data-slide="prev">--> <!--<span class="glyphicon glyphicon-chevron-left"></span>--> <!--</a>--> <!--<a href="#carousel" class="right carousel-control" data-slide="next">--> <!--<span class="glyphicon glyphicon-align-right"></span>--> <!--</a>--> </div> </div> <div class="container"> <div class="row"> <h3>Управление профилем:</h3> <p> <!--<a href="#" class="btn btn-default"><i class="fa fa-spinner fa-spin"></i></a>--> <a href="#" class="btn btn-default">Подписаться</a> <a href="html/signup.html" class="btn btn-primary">Зарегистрироваться</a> <a href="html/signin.html" class="btn btn-primary">Войти</a> <a href="#" class="btn btn-primary">Выход</a><br> <a href="#" class="btn btn-success">Кнопка 3</a> <a href="#" class="btn btn-warning">Кнопка 4</a> <a href="#" class="btn btn-info">Кнопка 5</a> <a href="#" class="btn btn-danger">Кнопка 6</a> <a href="#" class="btn btn-link">Кнопка 7</a> </p> <p> <a href="#" class="btn btn-primary btn-lg">Кнопка</a> <a href="#" class="btn btn-primary">Кнопка</a> <a href="#" class="btn btn-primary btn-sm">Кнопка</a> <a href="#" class="btn btn-primary btn-xs">Кнопка</a> </p> <p> <!-- Кнопка на всю ширину --> <a href="#" class="btn btn-primary btn-lg btn-block active">Кнопка</a> <a href="#" class="btn btn-primary btn-lg btn-block disabled">Кнопка</a> <button class="btn btn-success btn-lg btn-block" type="submit">Отправить</button> <input class="btn btn-success btn-lg btn-block" type="submit" value="Отправить"> </p> </div> </div> <div class="container-fluid"> <div class="row"> <div class="col-md-6"> <div class="row"> <div class="col-md-4"></div> <div class="col-md-4"></div> <div class="col-md-4"></div> </div> </div> </div> </div> </div> </div>