HTML के द्वारा web पेज को बनाया जाता हैं । किसी भी वेब पेज को बनाने के लिए text के साथ साथ image भी बहुत जरूरी होती हैं । HTML के द्वारा इमेज को वेब पेज पर display करने के लिए <img> टैग का उपयोग किया जाता हैं । जैसे की आप जानते ही होंगे की वेबसाइट पर image भी होती हैं जो उस पेज से related जानकारी को प्रदर्शित करती हैं । Text के साथ साथ image को पेज पर display करना यह बहुत अच्छा तरीका होता हैं । Image को पेज पर display करने के लिए इमेज टैग <img> के साथ src attribute का उपयोग भी किया जाता हैं ।
चलिए एक example से समझते हैं की HTML पेज पर image को कैसे display करते हैं ।
Syntax -
इस सिन्टैक्स में <img> एक टैग हैं और src में image का नाम दिया जाता हैं जिस से image HTML पेज पर डिस्प्ले हो जाती हैं ।
इमेज folder path -
यदि आप image को image फ़ोल्डर में रखते हैं और वेब पेज पर प्रदर्शित करना चाहते हैं। आपने फ़ोल्डर और image नाम और इसका format भी डिफाइन करना पड़ता हैं ।
साधारण Hindi भाषा में समझे तो यदि image किसी folder में और HTML फाइल उस फोल्डर से बाहर हैं तो फोल्डर का नाम और इमेज नाम को डिफाइन करना पड़ता हैं ताकि इमेज डिस्प्ले हो जाये ।
चलिए एक syntax से समझते हैं -
Syntax -
इस सिंटेक्स में images एक फोल्डर हैं और उस images में myimage नाम से एक इमेज हैं तो हम उसे कैसे लिखेंगे । सबसे पहले फोल्डर का नाम आता हैं images उसके बाद फोरवोर्ड स्लैश ( / ) आता हैं और उसके बाद image का नाम आता और डॉट( . ) के साथ इमेज की format आती हैं ।
इमेज फॉर्मेट-
सबसे पहले, उस image के फॉर्मेट की जांच करें जिसे आप वेब पेज पर प्रदर्शित करने जा रहे हैं।
आप इमेज प्रॉपर्टीज से इमेज फॉर्मेट की जांच कर सकते हैं।
जब तक आपको यह नहीं पता होगा की इमेज का क्या फॉर्मेट हैं तब तक इमेज को वेब पेज पर display नहीं किया जा सकता हैं ।
निचे कुछ image के format दिए गए है जिस से आपको इमेज फॉर्मेट के बारे में समझ आजायेगा ।
Formats-
jpg, png, gif, jpeg आदि।
ये सभी इमेज की format होती हैं । HTML में इमेज को डिस्प्ले करने के लिए सही image format देनी पड़ती हैं ।
चलिए सभी Image फॉर्मेट को कैसे लिखते हैं वो सिखते हैं -
Syntax -
इस सिंटेक्स में आप देख सकते हैं की इमेज की फॉर्मेट को किस तरह से डिफाइन करना होता हैं ।
इमेज Height एंड Width -
इमेज की height या width को बढ़ने के लिए height और width को डिफाइन करना होता हैं ।
Syntax-
HTML image Alt tag -
Alt टैग एक HTML image का एक महत्त्वपूर्ण attribute हैं जिसके द्वारा image के text को Alt टैग में लिखा जाता हैं ।
Image किस से सम्बंधित हैं यह सब alt टैग मैं लिखा जाता हैं ।
Syntax-
चलिए एक उदाहरण से इन सभी जानकारिओं को समझते हैं जिस से HTML में image को डिस्प्ले करना आसान हो जाता हैं ।
HTML Image
<!DOCTYPE html>
<html>
<head>
<title>Image attributes Tags </title>
</head>
<body>
<img src="images/myimage.jpg" alt="This is my image" height="200" width="300">
</body>
</html>
Run
HTML पेज पर इमेज को डिस्प्ले करने के लिए इमेज का path सही होना चाइये ।
Recommended Posts:-