- image tag in html in hindi
-
- Attributes of HTML image tag in hindi
- src
- alt
- width
- height
- Use of height and width attribute with image tag in hindi
- Use of alt attribute in hindi
- How to get image from another directory/folder?
- Use <img> tag as a link
- Attributes of HTML image tag in hindi
Introduction to HTML image tag
HTML img टैग का उपयोग वेब पेज पर image प्रदर्शित करने के लिए किया जाता है। HTML img टैग एक empty टैग है जिसमें केवल attributes होते हैं, HTML image तत्व में closing टैग का उपयोग नहीं किया जाता है।
आइए HTML छवि का एक उदाहरण देखें।
<h2>HTML Image Example</h2>
<img src="good_morning.jpg" alt="Good Morning Friends"/>
Output:
Attributes of HTML img tag
Src और alt HTML img टैग की महत्वपूर्ण विशेषताएं हैं। HTML इमेज टैग की सभी attribute नीचे दी गई हैं।
1) src
यह एक आवश्यक attribute है जो image के source या path का वर्णन करता है। यह ब्राउज़र को निर्देश देता है कि server पर image कहां देखें।
छवि का स्थान उसी directory या किसी अन्य सर्वर पर हो सकता है।
2) alt
alt attribute image के लिए एक वैकल्पिक text दिखाता है यदि image प्रदर्शित नहीं होती है,। Alt attribute की value शब्दों में image का वर्णन करता है। alt attribute को SEO prospective के लिए अच्छा माना जाता है।
3) width
यह एक वैकल्पिक attribute है जिसका उपयोग image को प्रदर्शित करने के लिए width को specify करने के लिए किया जाता है। यह अब recommended नहीं है। आपको चौड़ाई attribute के स्थान पर CSS लागू करना चाहिए।
4) height
यह image की ऊंचाई है। HTML height attribute भी iframe, image और object elements का समर्थन करती है। यह अब recommended नहीं है। आपको CSS को ऊंचाई की attribute के स्थान पर लागू करना चाहिए।
Use of height and width attribute with img tag in hindi
आपने अपने webpage में एक image कैसे डालें, इसके बारे में सीखा है, अब अगर हम अपनी आवश्यकता के अनुसार image प्रदर्शित करने के लिए कुछ ऊंचाई और चौड़ाई देना चाहते हैं, तो हम इसे image की ऊंचाई और चौड़ाई attributes के साथ सेट कर सकते हैं।
उदाहरण:
<img src="animal.jpg" height="180" width="300" alt="animal image">
Use of alt attribute
हम टैग के साथ Alt attribute का उपयोग कर सकते हैं। यदि ब्राउज़र पर image प्रदर्शित नहीं की जा सकती है तो यह एक alternative text प्रदर्शित करेगा। निम्नलिखित alt attribute के लिए उदाहरण है:
<img src="animal.png" height="80" width="180" alt="animal image">
Output:
How to get image from another directory/folder?
अपनी web में एक image सम्मिलित करने के लिए, वह image आपके उसी फ़ोल्डर में मौजूद होनी चाहिए जहां आपने HTML फ़ाइल डाली है। लेकिन अगर किसी मामले में image किसी अन्य directory में उपलब्ध है तो आप इस तरह से छवि को एक्सेस कर सकते हैं:
<img src="E:/images/animal.png" height="180" width="300" alt="animal image">
उपरोक्त कथन में हमने local डिस्क E ——> इमेज फोल्डर ——> animal.png में इमेज लगाई है।
Use <img> tag as a link
हम किसी image को अन्य पेज से भी जोड़ सकते हैं या हम किसी image को link के रूप में उपयोग कर सकते हैं। ऐसा करने के लिए, <a> टैग के अंदर <img> टैग डालें।
Example:
<a href="https://hinditutorialspoint.com/what-is-robotics"><img src="robot.jpg" height="100" width="100"></a>