Home >Web Front-end >JS Tutorial >BootStrap responsive navigation bar example introduction_javascript skills
Bootstrap, from Twitter, is currently the most popular front-end framework. Bootstrap is based on HTML, CSS, and JAVASCRIPT. It is simple and flexible, making web development faster. The responsive navigation bar allows you to view different effects on different devices.
Let me share the code with you:
<header role="banner"> <nav role="navigation" class="navbar navbar-default"> <div class="container"> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="index.html">Bootstrappin'</a> </div> <div class="navbar-collapse collapse"> <ul class="nav navbar-nav"> <li class="active"><a href="index.html">Home</a></li> <li><a href="#">Portfolio</a></li> <li><a href="#">Team</a></li> <li><a href="#">Contact</a></li> </ul> </div><!--/.nav-collapse --> </div><!--/.container --> </nav> </header>
data-toggle=”collapse” Expected Behavior
The above content is an example of BootStrap responsive navigation bar introduced by the editor. I hope it will be helpful to everyone!