The navbar is one of the prominent features of Bootstrap sites. A navigation bar is a navigation header that is placed at the top of the page. the navigation bar can extend or collapse, depending on the screen size. A standard navigation bar is created with the .navbar class.
Format of nav bar:-
- Vertical Navbar by using class=”navbar-nav”.
- Centered Navbar by using .justify-content-center class to center the navigation bar.
- Colored Navbar by using any of the .bg-color classes to change the background color of navbar.
- Brand/Logo by using .navbar-brand class is used to highlight the brand/logo/project name of your page.
- Collapsing The navbar To create a collapsible navigation bar, use a button with class=”navbar-toggler”, data-toggle=”collapse” and data-target=”#thetarget”.
- Navbar With Dropdown.
- Navbar Froms and Buttons Add a <form> element with class=”form-inline” to group inputs and buttons side-by-side.
- Nevbar Text use .navbar-text class to vertically align any elements inside the navbar that are not links.
- Fixed Navbar by using .fixed-top or .fixed-bottom class to make the navbar fixed.
- Sticky navbar use the .sticky-top class to make the navbar fixed/stay at the thop of the page.
Latest posts by vikashdev k (see all)
- PHP OOP: Traits - October 25, 2021
- PHP OOP: Late Static Binding - October 25, 2021
- PHP OOP : Static Members - October 23, 2021