HTML Editor
<!DOCTYPE html> <html lang="en-US"> <head> <style> img{ width: 250px; height: 150px; border: 1px solid #000; object-fit: fill; } </style> </head> <body> <h1>CSS object-fit Property</h1> <div> <img src="devices.jpg"> </div> <button onclick="myFunction()">Click Me</button> <script> var x = document.getElementsByTagName("img")[0]; function myFunction(){ x.style.objectFit = "none"; } </script> <p><strong>Note</strong>: Click on the button to change the 'object-fit' from fill to none.</p> </body> </html>
OUTPUT
×

Save as Private