কম্পিউটার টিউটোরিয়াল

CSS দিয়ে মাউস হোভারে ছবি ফ্লিপ করুন


ছবি ফ্লিপ করতে CSS transform প্রপার্টি ব্যবহার করুন। মাউস হোবারে ছবি ফ্লিপ করতে নিচের কোডটি চালাতে পারেন:

উদাহরণ

<!DOCTYPE html> <html>    <head>       <style>          .myimg:hover {             transform: scaleX(-1);          }       </style>    </head>    <body>       <h2>Heading One</h2>       <p>Let's flip the image on mouse over:</p>       <img class = "myimg" src = "https://www.tutorialspoint.com/python/images/python_data_science.jpg"          alt = "Python Data Science" width = "300" height = "200">    </body> </html> 

  1. CSS দিয়ে ইমেজে বাটন যোগ করা

  2. মাউস ওভারে ইমেজ অপাসিটি পরিবর্তন করার পদ্ধতি

  3. CSS দিয়ে ফ্লিপ কার্ড তৈরি করার পদ্ধতি

  4. CSS দিয়ে ফ্লিপ বক্স (Flip Box) তৈরি