HTML <img> टैग से इमेज जोड़ना
वेबपेज पर इमेज लगाने के लिए <img> टैग का उपयोग करें। यह टैग इमेज सोर्स, ऑल्ट टेक्स्ट, चौड़ाई, ऊंचाई आदि जोड़ने की अनुमति देता है। alt वैकल्पिक टेक्स्ट विशेषता है, जो इमेज लोड न होने पर दिखाई देता है।
मुख्य विशेषताएं (Attributes)
| विशेषता | विवरण |
|---|---|
| alt | इमेज के लिए वैकल्पिक टेक्स्ट |
| height | इमेज की ऊंचाई |
| ismap | इमेज को सर्वर-साइड इमेज-मैप के रूप में उपयोग |
| longdesc | इमेज के विस्तृत विवरण का URL |
| src | इमेज का URL (आवश्यक) |
| usemap | इमेज को क्लाइंट-साइड इमेज-मैप के रूप में उपयोग |
| width | इमेज की चौड़ाई |
नोट: <img> टैग का कोई एंड टैग नहीं होता (यह सेल्फ-क्लोजिंग टैग है)।
उदाहरण
<!DOCTYPE html>
<html>
<head>
<title>HTML img टैग</title>
</head>
<body>
<h1>Tutorialspoint</h1>
<h2>सिंपल ईजी लर्निंग</h2>
<img src="/green/images/logo.png" alt="Tutorialspoint" width="260" height="100">
</body>
</html>
सर्वोत्तम अभ्यास
- हमेशा
altविशेषता दें (एक्सेसिबिलिटी और SEO के लिए)। - चौड़ाई/ऊंचाई निर्दिष्ट करें ताकि लेआउट शिफ्ट न हो।
- आधुनिक फॉर्मेट जैसे WebP का उपयोग करें।
- रिस्पॉन्सिव इमेज के लिए
srcsetऔरsizesका उपयोग करें।