Computer >> कंप्यूटर >  >> प्रोग्रामिंग >> CSS

CSS के साथ माउस पर एक छवि पलटें

<घंटा/>

किसी इमेज को फ़्लिप करने के लिए ट्रांसफ़ॉर्म सीएसएस प्रॉपर्टी का इस्तेमाल करें. आप माउसओवर पर किसी छवि को फ़्लिप करने के लिए निम्न कोड चलाने का प्रयास कर सकते हैं:

उदाहरण

<!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. माउस ओवर पर छवि अस्पष्टता बदलें

    माउस-ओवर पर अपारदर्शिता को बदलने के लिए :hover चयनकर्ता के साथ अपारदर्शिता गुण का उपयोग करें। माउस पर छवि अस्पष्टता बदलने के लिए कोड निम्नलिखित है - उदाहरण <!DOCTYPE html> <html> <head> <style> body{    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-

  1. CSS के साथ फ्लिप कार्ड कैसे बनाएं?

    CSS के साथ एक फ्लिप कार्ड बनाने के लिए, कोड इस प्रकार है - उदाहरण <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style>    body {       font-family: 'Segoe UI', Tah

  1. CSS के साथ फ्लिप बॉक्स कैसे बनाएं?

    CSS के साथ एक फ्लिप बॉक्स बनाने के लिए, कोड इस प्रकार है - उदाहरण <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style>    body {       font-family: 'Segoe UI', Tah