एचटीएमएल में एक तस्वीर कैसे डालें?

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

छवि टैग

टैग जो साइट पर छवि प्रदर्शित करने के लिए ज़िम्मेदार है वह HTML के सभी संस्करणों के लिए सार्वभौमिक है। यह <img> टैग है यह थोड़ा अलग रूप ले सकता है, लेकिन सार एक ही रहता है।

उदाहरण के लिए, html में आप केवल एक <img> टैग का उपयोग कर सकते हैं एक्सएचटीएमएल में, सभी टैग निजी होना चाहिए। इसलिए, टैग के अंत में, आपको सही स्लैश डाल देना चाहिए: <img />।

छवि टैग विशेषताओं

छवियां डालने के दौरान, कई विशेषताओं का उपयोग किया जाता है चलो उन्हें लगातार विचार करें

प्रमुख विशेषता एसआरसी है यह एक तस्वीर है कि आप एक वेब पेज पर अपलोड करना चाहते का पता इंगित करता है। उदाहरण एचटीएमएल इस तरह दिखेगा: <img src = "http://mysite.ru/picture.png"> उदाहरण एक्सएचटीएमएल इस तरह दिखेगा: <img src = "http://mysite.ru/picture.png" />
दो विशेषताओं छवि आकार से संबंधित हैं। अर्थात्, चौड़ाई विशेषता चौड़ाई और ऊंचाई क्रमश: छवि की ऊंचाई निर्धारित करने के लिए प्रदान करता है। उदाहरण एचटीएमएल: <img src = "/ images / picture.png" चौड़ाई = "300" ऊंचाई = "100"> एक्सएचटीएमएल के लिए: <img src = "picture.png 'चौड़ाई =" 300 "ऊंचाई =" 100 "/ > इसके अलावा किसी भी एक प्रोग्रामिंग भाषा के लिए रजिस्टर करने के लिए सलाह दी जाती गुण, एक स्पष्ट सादृश्य है क्योंकि हर जगह।
Alt विशेषता में एक संक्षिप्त विवरण शामिल होना चाहिएतस्वीरें। यह पाठ तब प्रकट होता है जब चित्र लोड नहीं होता है या यदि उपयोगकर्ता "चित्र" अनुभाग में खोज इंजन के माध्यम से जानकारी की खोज करता है। कोड की एक पंक्ति का एक उदाहरण: <img src = "/ images / picture.png" alt = "दिलचस्प चित्र">
शीर्षक तस्वीर को शीर्षक देता है। उपयोगकर्ता द्वारा आवश्यक जानकारी की खोज करते समय यह भी महत्वपूर्ण है। <img src = "/ images / picture.png" शीर्षक = "चित्र">
वर्स्पेस विशेषता चित्र और अन्य मार्कअप तत्वों (उदाहरण के लिए, पाठ) के बीच खड़ी इंडेंट निर्दिष्ट करती है। मान पिक्सेल में मापा जाता है
Hspace विशेषता समान इंडेंटेशन निर्दिष्ट करती है, लेकिन क्षैतिज रूप से। मान को पिक्सल में मापा जाता है पिछले दो विशेषताओं के लिए एक उदाहरण: <img src = "/ images / picture.png" vspace = "5" hspace = "5">
सीमा विशेषता का उपयोग करते हुए, छवि को सीमा से रेखांकित किया जाता है यदि मान विशेष रूप से सेट नहीं है, तो डिफ़ॉल्ट 0 है। उदाहरण: <img src = "/ images / picture.png" border = "1">

छवियों के लिए अतिरिक्त सुविधाएं

एक चित्र न केवल पाठ में डाला जा सकता हैवेब पेज, लेकिन पृष्ठभूमि भी बनाते हैं चित्र पृष्ठभूमि एक शरीर टैग या सीएसएस शैली का एक विशेषता है। आपकी साइट की पृष्ठभूमि में एक चित्र कैसे सम्मिलित करें, इसके बारे में अधिक जानकारी, आप लेख में सीखेंगे कि कैसे html में एक पृष्ठभूमि बनाने के लिए।

आप तालिका में एक छवि सम्मिलित कर सकते हैं फिर चित्र पूरे पृष्ठ के लिए पृष्ठभूमि नहीं होगा, लेकिन केवल एक निश्चित क्षेत्र के लिए। और इस प्रकार छवि की जगह तय हो जाएगी, भले ही आसपास के पाठ को ध्यान न दें ऐसा करने के लिए, आपको एक HTML तालिका बनाने की आवश्यकता है। याद रखें कि टेबल टैग तालिका है, स्ट्रिंग टैग tr (स्ट्रिंग) है, कॉलम टैग टीडी है

टीडी टैग के बाद चित्र डाला जाता है। यह कैसे दिखेगा:

<टेबल सीमा = '0'>
<tr align = 'left'>
<td> <img src = 'picture.png'> </ td>
<td> दूसरा सेल </ td>
</ tr>
<tr align = "right">
<td> तीसरा सेल </ td>
<td> चौथा सेल </ td>
</ tr>
</ table>