हेल्लो दोस्तों आज इस पोस्ट में आपको Image in html in Hindi के बारे में बताया जा रहा है की ये क्या होता है कैसे काम करता है और बहुत कुछ तो चलिय शुरू करते है
Contents
Introduction to html & image
html image के द्वारा आप webpage को attractive और beautiful बनाया जा सकता है इसके लिए html(Image in html in Hindi) के द्वारा वेब पेज में आप कोई image को add करते है तो इसके लिए image tag <img> tag का प्रयोग किया जाता है <img> tag बहुत से attribute provide करता है जिसके द्वारा image की presentation को control करता है
इन attribute के बारे में निचे दिया जा रहा है
attribute | Explanation |
src | इस attribute के द्वारा आप जो image को show करना चाहते है तो उसका value में उसका url दिया जा रहा है |
alt | इस attribute के द्वारा value text होती है यदि किसी से आप की image webpage पर show नही होती है तो उसकी जगह text या icon show होता है एक तरह से ये image का alternative होता है |
width | इस attribute के द्वारा आप image की width set कर सकते है |
height | इस attribute के द्वारा आप image की height set कर सकते है |
style | इस attribute के द्वारा आप images पर CSS rules apply कर सकते है |
Including Image in webpage
किसी भी webpage में image include करने के लिए <img> tag का प्रयोग किया जाता है इस tag के साथ src attribute का प्रयोग आवश्यक होता है src attribute के value में image का url दिया जाता है बाकि सभी attribute optional होता है
इसका example निचे दिया जा रहा है
<html>
<head>
<title>webpage image</title>
</head>
<body>
<img src=”image-url.jpg”>
</body>
</html>
OUTPUT
Alternative text with Image
यदि webpage पर image नही show हो रहा है तो वह पर alternative text या icon उस स्थान पर show होता है ये attribute search इंजन में image किसके बारे में है
इसको हम एक example के द्वारा आसानी से समझ सकते है
<html>
<head>
<title>image with alternative text</title>
</head>
<body>
<img src=”url-image.jpg” alt=”c3school”>
</body>
</html>
OUTPUT
इसमे आप देख सकते है यदि किसी कारण image show नही होता है तो alternative text show होता है
height and width image
किसी भी image की height और width को set करने के लिए ये दोनों attribute का प्रयोग किया जाता है तथा आप इन दोनों attribute की value integer में define किया जाता है
<html>
<head>
<title>height and width image</title>
</head>
<body>
<img src=”image-url.jpg” height=”150” width=”180”>
</body>
</html>
border of image
border भी attribute की तरह होता है जिसमे आप image की border भी set कर सकते है इसके लिए आप border attribute का प्रयोग किया जाता है
इस attribute की value border की size की तरह होती है
<html>
<head>
<title>image with border</title>
</head>
<body>
<img src=”image-url.jpg” border=”5”>
</body>
</html>
Image link active
हम image को एक link की तरह भी प्रयोग किया जा सकता है जिससे आप webpage पर image पर click करने पर आप webpage या new window open हो जायेगा
इसके लिए <img> tag को <a> tag (a=anchor) में लिखते है anchor tag में text की जगह आप <img> tag को define करते है
इसका example निचे दिया गया है
<html>
<head>
<title>image link enable</title>
</head>
<body>
<a href=https://wwwjavahindi.com><img src=”image-url”></a>
</body>
</html>
reference-https://www.tutorialspoint.com/html/html_images.htm
निवेदन:-आप सभी छात्र –छात्रों से निवेदन है की अगर आपको ये Topic अच्छा लगा हो तो कृपया आप इस वेबसाइट के बारे में अपने दोस्तों को जरुर बताये अगर कोई topic से संबधित प्रश्न हो तो कमेंट्स(comments) आपके लिए ही बना है और किसी Subject के लेकर भी कोई प्रश्न हो तो कमेंट करे