কম্পিউটার

কিভাবে CSS এর সাথে সমান-প্রস্থের নেভিগেশন লিঙ্ক সহ একটি নেভিগেশন বার তৈরি করবেন?


সমান-প্রস্থের নেভিগেশন লিঙ্কগুলির সাথে একটি নেভিগেশন বার তৈরি করার কোডটি অনুসরণ করা হয়েছে৷−

উদাহরণ

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
body{
   margin:0px;
   margin-top:60px;
   padding: 0px;
}
*,*::before,*::after{
   box-sizing: border-box;
}
nav{
   position: fixed;
   top: 0;
   width: 100%;
   background-color: rgb(39, 39, 39);
   overflow: auto;
   height: auto;
}
.links {
   width: 20vw;
   padding: 17px;
   display: inline-block;
   text-align: center;
   color: rgb(178, 137, 253);
   text-decoration: none;
   font-size: 17px;
}
.links:hover {
   background-color: rgb(100, 100, 100);
}
.selected{
   background-color: rgb(0, 18, 43);
}
</style>
</head>
<body>
<nav>
<a class="links selected" href="#">Home</a>
<a class="links" href="#">Login</a>
<a class="links" href="#">Register</a>
<a class="links" href="#">Contact Us</a>
<a class="links" href="#">More Info</a>
</nav>
<h1>Equal width navigation menu</h1>
</body>
</html>

আউটপুট

উপরের কোডটি নিম্নলিখিত আউটপুট −

তৈরি করবে

কিভাবে CSS এর সাথে সমান-প্রস্থের নেভিগেশন লিঙ্ক সহ একটি নেভিগেশন বার তৈরি করবেন?


  1. কিভাবে CSS দিয়ে পেজিনেশন তৈরি করবেন?

  2. কিভাবে CSS দিয়ে একটি পিল নেভিগেশন মেনু তৈরি করবেন?

  3. কিভাবে CSS দিয়ে একটি স্কিল বার তৈরি করবেন?

  4. কিভাবে CSS দিয়ে একটি অন স্ক্রোল ফিক্সড নেভিগেশন বার তৈরি করবেন?