কম্পিউটার

কিভাবে CSS দিয়ে হোভারে একটি উপাদান প্রদর্শন করবেন?


সিএসএস দিয়ে হোভারে একটি উপাদান প্রদর্শন করতে, কোডটি নিম্নরূপ -

উদাহরণ

<!DOCTYPE html>
<html>
<head>
<style>
   body{
      margin:20px;
      padding:20px;
      font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
   }
   .hiddenText {
      display: none;
   }
   .hoverDiv:hover + .hiddenText {
      display: block;
      color: rgb(71, 0, 65);
      font-size: 22px;
      font-weight: bold;
   }
</style>
</head>
<body>
<h1>Display an Element on Hover Example</h1>
<div class="hoverDiv" style="font-size: 18px;">Hover over me.</div>
<div class="hiddenText">This text is shown by hovering on the above div</div>
</body>
</html>

আউটপুট

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

কিভাবে CSS দিয়ে হোভারে একটি উপাদান প্রদর্শন করবেন?

"আমার উপর হোভার করুন" টেক্সট −

-এর উপর হোভার করার সময়

কিভাবে CSS দিয়ে হোভারে একটি উপাদান প্রদর্শন করবেন?


  1. কিভাবে CSS দিয়ে একটি উপাদানের অনুপাত বজায় রাখা যায়?

  2. কিভাবে CSS দিয়ে স্ক্রলবার লুকাবেন?

  3. কিভাবে CSS দিয়ে হোভারে ট্রানজিশন যোগ করবেন?

  4. কিভাবে CSS দিয়ে একটি বৃত্তাকার পাথে একটি উপাদান সরানো যায়?