https://github.com/henokrb/responsive-header-html-css-js

Responsive Header using HTML, CSS & JS
https://github.com/henokrb/responsive-header-html-css-js

css html javascript

Last synced: 17 days ago
JSON representation

Responsive Header using HTML, CSS & JS

• Host: GitHub
• URL: https://github.com/henokrb/responsive-header-html-css-js
• Owner: henokrb
• Created: 2024-11-03T10:13:27.000Z (17 days ago)
• Default Branch: main
• Last Pushed: 2024-11-03T10:14:40.000Z (17 days ago)
• Last Synced: 2024-11-03T10:18:45.377Z (17 days ago)
• Topics: css, html, javascript
• Language: CSS
• Homepage: https://heny.dev/projects/responsive-header/
• Size: 0 Bytes
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: Readme.md

Awesome Lists containing this project

README

        
## 🤘 Responsive Header (HTML, CSS & Javascript)

---

### Desktop View

Desktop Header view with Logo, Menu & Call to Action (CTA) Button.

#### Features

- [x] You can either use Text or Image for the Logo

- [x] Menu hover color change and underline effect

- [x] Identify Active Menu with accent color

- [x] Logo & CTA Button with hover scale effect

- [x] Favicon added

![image](https://heny.dev/projects/responsive-header/assets/images/Header-Desktop.png)

### Resposive View

Resposive Header view with Logo, Menu & Call to Action (CTA) Button.

#### Features

- [x] You can use a separate responsive logo (either Text or Image)

![alt text](https://heny.dev/projects/responsive-header/assets/images/Header-Responsive.png)

### Resposive View - Menu opened

Resposive Menu when opened.

#### Features

- [x] Added Logo on the top-left position

- [x] close icon on the right-top

![image](https://heny.dev/projects/responsive-header/assets/images/Header-Responsive-Menu-Opened.png)

### Demo

You can visit the demo [here](https://heny.dev/projects/responsive-header/)

---

Developed with ❤️ by [Henok R. Bedassa](https://heny.dev).

If you love my project please star ⭐️ my repo!\*\*