Bootstrap Basic Tutorial (Bangla)- Part 8- BS Navigation Bar-navbar (button-form -fixed)

A navigation bar is a navigation header that is placed at the top of the page.
With Bootstrap, a navigation bar can extend or collapse, depending on the screen size.
If you don't like the style of the default navigation bar, Bootstrap provides an alternative, black navbar by inverted navigation bar.
Just change the .navbar-default class into .navbar-inverse.
Navigation bars can also hold dropdown menus.
The .navbar-right class is used to right-align navigation bar buttons.
To add buttons inside the navbar, add the .navbar-btn class on a Bootstrap button.
To add form elements inside the navbar, add the .navbar-form class to a form element and add an input(s). Note that we have added a .form-group class to the div container holding the input. This adds proper padding if you have more than one inputs.
You can also use the .input-group and .input-group-addon classes to attach an icon or help text next to the input field. You will learn more about these classes in the Bootstrap Inputs chapter.
The navigation bar can also be fixed at the top or at the bottom of the page.

A fixed navigation bar stays visible in a fixed position (top or bottom) independent of the page scroll.
The .navbar-fixed-top class makes the navigation bar fixed at the top.
The .navbar-fixed-bottom class makes the navigation bar stay at the bottom.
The navigation bar often takes up too much space on a small screen.

We should hide the navigation bar; and only show it when it is needed.

In the following example we insert a "Sign Up" button and a "Login" button to the right in the navigation bar. We also add a glyphicon on each of the two new buttons