Update: For Bootstrap 4 example scroll to the bottom of post.
One of most used component of Bootstrap with Navbar. The navbar menu is responsive and adapts to any screen size. For small devices (mobile) the navbar get collapsed and a burger icon appears which can be used to open/close menu in navbar.
So how does this works? First check the html. We added a checkbox and hide it using CSS. Next we changed the button into label and connect the label to checkbox using for="". So whenever you click the burger menu which act as label for checkbox toggles it state. And as per the state of checkbox we show or hide the content.