Navbars are placed at the top of the screen and contain title of the page and navigation elements. Navbar contains three parts each of which may contain any HTML content, but it is preferred to use these in the following way:
- Left: It is used to place back link icons or single text link.
- Center: It is used to display title of the page or tab links.
- Right: It is same as left part.
A list of Navbar types with description:
| Index | Navbar Type | Description |
|---|---|---|
| 1) | Basic navbar | A basic navbar can be created by using the navbar, navbar-inner, left, center and right classes. |
| 2) | Navbar with links | To use links in left and right part of your navbar, just add tag with the class link |
| 3) | Multiple links | To use multiple links, just add few more to the part of the choice. |
| 4) | Links with text and icons | The links can be provided with icons and texts by adding classes for icons and wrapping the link text with element. |
| 5) | Links with only icons | Navbar links can be provided with only icons by adding icon-only class to links. |
| 6) | Related app and view methods | On initializing the View, framework7 allows you to use methods available for navbar. |
| 7) | Hide navbar automatically | The navbar can be hidden/shown automatically for some Ajax loaded pages where navbar is not required. |
Next Topic:-Click Here