CSS से प्रतिशत में इमेज की ऊंचाई और चौड़ाई सेट करें

% यूनिट का उपयोग

इमेज की ऊंचाई और चौड़ाई प्रतिशत (%) में सेट करने के लिए height और width प्रॉपर्टीज में प्रतिशत मान दिए जाते हैं। यह पैरेंट कंटेनर के सापेक्ष आकार निर्धारित करता है।

उदाहरण

<!DOCTYPE html>
<html>
  <head>
    <style>
      img {
        height: 50%;
        width: 50%;
      }
    </style>
  </head>
  <body>
    <p>Sized image in %</p>
    <img src="https://www.tutorialspoint.com/videotutorials/assets/videos/courses/155/images/course_155_image.png" alt="CSS" width="200" height="200">
  </body>
</html>

महत्वपूर्ण: यदि केवल width: 50% सेट किया जाए और height: auto (डिफ़ॉल्ट) रहे, तो इमेज का आस्पेक्ट रेशियो बना रहता है। दोनों सेट करने से इमेज विकृत हो सकती है।