Category: 03. Advance

The Bootstrap Scrollspy plugin is used to automatically update links in a navigation list based on scroll position. See this example: Bootstrap Vertical Scrollspy Menu You can also use vertical navigation pills as menu. See this example:

The bootstrap popover plugin is very similar to tooltips. It appears as a pop-up box when the user clicks on an element. The difference is that the popover can contain much more content. To create a popover, add the data-toggle=”popover” attribute to an element and the title attribute to specify the header text of the popover, the…

The bootstrap modal plugin is a dialog box / popup window that is displayed on top of the current page. Bootstrap Modal Example Bootstrap Modal Size You can change the size of the modal by adding the .modal-sm class for small modals or .modal-lg class for large modals. The size class is added to the <div> element with class…

Bootstrap Input Types Input type: checkbox Input type: radio button Bootstrap Checkbox Checkbox facilitates you to select any number of options from a list of present options. See this example: Use the .checkbox-inline class if you want the checkboxes to appear on the same line: See this example: Bootstrap Radio Buttons Radio buttons also facilitates you to…

A navigation bar is like a navigation header that is placed at the top of the page. You can collapse or extend it according to the screen size. You can create a standard navigation bar at the top of the page with with <nav class=”navbar navbar-default”>. See this example: Bootstrap Inverted Navigation Bar Inverted navigation bar…

Bootstrap Menus Menus are used in most of the web pages. These are defined in an unordered list <ul>. You have to add the .list-inline class to <ul> to create a horizontal menu. See this example: Bootstrap Tabs You can create a basic navigation tag with <ul class=”nav nav-tabs”>. You can also mark the current page with <li class=”active”>.…