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

HTML में इमेज को रेस्पॉन्सिव कैसे बनाएं?

छवि को प्रतिक्रियाशील बनाने के लिए, आपको दो गुण सेट करने होंगे। टैग का उपयोग करके छवि जोड़ें और इसे प्रतिक्रियाशील बनाने के लिए ऊंचाई और अधिकतम-चौड़ाई के लिए CSS शैली जोड़ें। उदाहरण के लिए, style="height:auto;max-width:100%;"

HTML में इमेज को रेस्पॉन्सिव कैसे बनाएं?

HTML में इमेज को रिस्पॉन्सिव बनाने के लिए आप निम्न कोड को चलाने का प्रयास कर सकते हैं -
नोट - किसी छवि की प्रतिक्रिया की जांच करने के लिए, ब्राउज़र टैब का आकार बदलें। यदि छवि का आकार सही ढंग से बदलता है, तो इसका अर्थ है कि यह प्रतिक्रियाशील है।

उदाहरण

<!DOCTYPE html>
<html>
   <head></head>
   <body>
      <img src="https://www.tutorialspoint.com/images/video_tutorial_intro.jpg" alt="Video Tutorials" style="height:auto;max-width:100%;">
   </body>
</html>

आउटपुट

HTML में इमेज को रेस्पॉन्सिव कैसे बनाएं?


  1. HTML मानचित्रण छवि

    HTML मैपिंग इमेज एक क्लाइंट-साइड इमेज-मैप है जिसमें क्लिक करने योग्य क्षेत्र होते हैं जो HTML दस्तावेज़ में हाइपरलिंक के रूप में कार्य करता है। मानचित्र . के बीच संबंध बनाने के लिए और img HTML तत्व मानचित्र . का नाम विशेषता है एलिमेंट img यूजरमैप एट्रिब्यूट से जुड़ा है। सिंटैक्स निम्नलिखित वाक्य

  1. पेंट और पेंट 3D में पृष्ठभूमि को पारदर्शी कैसे बनाएं?

    पेंट शायद विंडोज का सबसे अच्छा टूल है और अद्भुत काम करता है जिसे हम आमतौर पर अन्य सॉफ्टवेयर में तलाशने की कोशिश करते हैं। ठीक है, इस ब्लॉग में लेकिन हम आपको पेंट में पृष्ठभूमि को पारदर्शी बनाने के चरणों के बारे में बताएंगे। मैंने जितने भी विंडोज़ छवि संपादक देखे हैं, उनमें से पेंट सबसे सरल है और आसा

  1. चित्र की पृष्ठभूमि को पारदर्शी कैसे बनाएं

    कई बार ऐसा होता है जब आपको पृष्ठभूमि के बिना एक छवि की आवश्यकता होती है। ऐसा इसलिए हो सकता है क्योंकि आप अन्य तस्वीरों पर या उत्पाद प्रचार के लिए लोगो जोड़ना चाहते हैं। अव्यवस्थित पृष्ठभूमि के बिना चित्र प्राप्त करना कई तरीकों से संभव है। आप विंडोज या मैक के लिए बहुत सारे टूल उपलब्ध पा सकते हैं। आप