WEBLEB
Home
Editor
Accedi
Pro
Italiano
English
Français
Español
Português
Deutsch
Italiano
हिंदी
3836
bhanu.sharma55
Apri nell'Editor
Pubblica il Tuo Codice
Consigliato
11 February 2025
casa
10 February 2025
informazioni sulla carta
HTML
Copy
Responsive_Navbar
Shau-nay
Home
About-Us
Service
Contact-Us
Feedback
CSS
Copy
/* Replace with your CSS Code (Leave empty if not needed) */ * { margin: 0; padding: 0; text-decoration: none; list-style: none; box-sizing: border-box; } body { font-family: monospace; } nav { background-color: rgb(17, 17, 51); height: 80px; width: 100%; } .logo { color: white; font-size: 35px; line-height: 80px; padding: 0 100px; font-weight: bold; } nav ul { float: right; margin-right: 20px; } nav ul li { display: inline-block; line-height: 80px; margin: 0 5px; } nav ul li a { color: white; font-size: 17px; padding: 7px 13px; border-radius: 3px; text-transform: uppercase; } .active,a:hover { background: #1B9BFF; transition: .5s; } .checkbtn { font-size: 30px; color: white; float: right; line-height: 80px; margin-right: 40px; cursor: pointer; display: none; } #check { display: none; } .main { background-image: url("background.jpg"); width: 100%; height: 89vh; background-repeat: no-repeat; background-size: cover; } @media (max-width : 950px) { .logo { font-size: 30px; padding-left: 50px; } nav ul li a { font-size: 16px; } } @media (max-width : 850px) { .checkbtn { display: block; } ul { position: fixed; width: 100%; height: 100vh; background: #2C3E50; top: 80px; left: -100%; text-align: center; transition: all .5s; } nav ul li { display: block; margin: 50px 0; line-height: 30px; } nav ul li a { font-size: 20px; } a:hover,.active { background: none; color: #0083E6; } #check:checked ~ ul { left: 0; } }
JS
Copy
/* Replace with your JS Code (Leave empty if not needed) */