কম্পিউটার

সিএসএস দিয়ে কীভাবে একটি বোতাম গ্রুপ তৈরি করবেন?


সিএসএস ব্যবহার করে একটি বোতাম গ্রুপ তৈরি করার কোডটি অনুসরণ করা হল -

উদাহরণ

<!DOCTYPE html>
<html>
<style>
.btnGroup{
   display: inline-block;
   font-size: 0;
   border: 2px solid darkgreen;
   box-shadow: 5px 10px 18px rgb(55, 173, 39);
}
button{
   float: left;
   margin:0px;
   border:none;
   padding: 15px;
   font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
   font-weight: bold;
   font-size: 20px;
}
button:not(:last-child){
   border-right: 2px solid rgb(6, 134, 49);
}
button:hover{
   background:rgb(48, 24, 134);
   box-shadow: 5px 10px 18px rgb(41, 39, 173);
   color:white;
}
</style>
<body>
<h1>Button Group</h1>
<div class="btnGroup">
<button>Facebook</button>
<button>Twitter</button>
<button>LinkedIn</button>
</div>
<h2>Hover over the above button group to see hover effects</h2>
</body>
</html>

আউটপুট

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

তৈরি করবে

সিএসএস দিয়ে কীভাবে একটি বোতাম গ্রুপ তৈরি করবেন?

বোতাম গ্রুপের যে কোনো বোতামের উপরে হোভার করার সময় −

সিএসএস দিয়ে কীভাবে একটি বোতাম গ্রুপ তৈরি করবেন?


  1. কিভাবে CSS দিয়ে সার্চ বাটন তৈরি করবেন?

  2. কিভাবে CSS দিয়ে কার্ড তৈরি করবেন?

  3. কিভাবে CSS দিয়ে একটি কুপন তৈরি করবেন?

  4. কিভাবে CSS দিয়ে তীর তৈরি করবেন?