41 lines
895 B
Markdown
41 lines
895 B
Markdown
# Navbar Documentation
|
|
|
|
A lightweight navbar inspired by Bootstrap 2 with cleaner HTML and easier customization.
|
|
|
|
## Features
|
|
|
|
- Simple, semantic HTML structure
|
|
- CSS variables for easy theming
|
|
- No dependencies
|
|
- Responsive design
|
|
- CSS-only dropdowns
|
|
|
|
## Usage
|
|
|
|
1. Include the CSS and JS files:
|
|
```html
|
|
<link rel="stylesheet" href="navbar.css">
|
|
<script src="navbar.js"></script>
|
|
```
|
|
|
|
2. Add the navbar HTML to your page:
|
|
```html
|
|
<nav class="navbar">
|
|
<div class="navbar-inner">
|
|
<a class="brand" href="#">Site Name</a>
|
|
<!-- Add navigation here -->
|
|
</div>
|
|
</nav>
|
|
```
|
|
|
|
## Variants
|
|
|
|
### Standard Navbar
|
|
Default navbar with rounded corners and bottom margin.
|
|
|
|
### Fixed Navbar
|
|
Add class `navbar-fixed` to the navbar element to make it stick to the top of the viewport.
|
|
|
|
### Static Top Navbar
|
|
Add class `navbar-static-top` to the navbar element for a full-width navbar without rounded corners.
|