HTML में छवियां कैसे डालें

सोशल नेटवर्क में अपनी वेबसाइट या प्रोफाइल में छवियां जोड़ना, इसे सुशोभित करने का एक शानदार तरीका है। एचटीएमएल (हायपरटेक्स्ट मार्कअप लैंग्वेज) में कई वेब डेवलपमेंट क्षमताओं हैं, लेकिन छवियों को जोड़ने के लिए आवश्यक कोड अपेक्षाकृत सरल है।

सामग्री

कदम

Html में चित्र डालें

टिप्स
चेतावनी

कदम

HTML में चित्र डालें

एचटीएमएल चरण 1 के साथ चित्र सम्मिलित करें छवि शीर्षक

अपनी छवि को ऐसी साइट पर अपलोड करें जो छवि होस्टिंग सेवा प्रदान करती है, जैसे फोटोबकेट या टिनीपिक, और जो आपको हॉट-लिंकिंग का उपयोग करने की अनुमति देती है हॉट-लिंक करने के साथ हम साइट सर्वर से छवि का एक सीधा लिंक कहते हैं - कुछ साइट्स इसे अनुमति नहीं देते क्योंकि यह अपने बैंडविड्थ का लाभ उठाती है और अपने सर्वर पर जगह लेता है

अगर आपके पास भुगतान की गई होस्टिंग सेवा है, तो छवि अपलोड करने के लिए एक का उपयोग करना बेहतर होगा। यह मुफ्त साइटों की तुलना में अधिक विश्वसनीय है

एचटीएमएल चरण 2 के साथ छवियों को सम्मिलित करें

पाठ संपादक में एक नया दस्तावेज़ खोलें (उदा। नोटपैड), या सीधे साइट / प्रोफाइल पर जहां आप HTML को संपादित कर सकते हैं

एचटीएमएल चरण 3 के साथ छवियाँ सम्मिलित करें

टैग से प्रारंभ करें img. टैग img यह खाली है, जिसका मतलब है कि इसे बंद करने की कोई आवश्यकता नहीं है। हालांकि, इसे एक्सएचटीएमएल में भी वैध होने के लिए, आप एक प्रमुख स्थान के पहले और एक स्लैश जोड़ सकते हैं।

कई विशेषताएं हैं जिन्हें जोड़ा जा सकता है, लेकिन केवल एक बिल्कुल आवश्यक है: src. यह आपकी छवि का पता, या यूआरएल को इंगित करता है

अब आपको विशेषता जोड़नी चाहिए पड़ाव. यह वैकल्पिक पाठ को निर्दिष्ट करता है जब छवि लोड नहीं होती है। इसके अलावा, यह अंधा के लिए कंप्यूटर पर स्वत: पाठकों द्वारा पढ़ा जाता है

छवि पर कर्सर की ओर इशारा करते हुए, वैकल्पिक पाठ दिखाई देगा, लेकिन केवल इंटरनेट एक्सप्लोरर में। एक समाधान जो सभी ब्राउज़रों पर काम करता है (फ़ायरफ़ॉक्स ठीक है एट अल) विशेषता का उपयोग करना है शीर्षक तथा पड़ाव. (यदि आपको कोई परवाह नहीं है कि संदेश छवि पर दिखाई देता है, तो इस चरण को भूल जाओ।)

उदाहरण:

1
इसके अलावा, विशेषताओं का उपयोग करते हुए, छवि का आकार निर्दिष्ट करने की संभावना भी है ऊंचाई और चौड़ाई (ऊंचाई और चौड़ाई) और पिक्सल की संख्या या प्रतिशत में निर्दिष्ट करके ध्यान रखें कि यह मान बदलने से केवल छवि को कैसे प्रदर्शित किया जाएगा। ब्राउज़र अभी भी छवि के वास्तविक आकार को लोड करेगा, इसलिए यदि आपके पास एक बहुत बड़ा है, तो आप इसे एक तस्वीर संपादन प्रोग्राम, या PicResize.com का उपयोग करके इसका आकार बदलना चाहिए।

टिप्स

इन विशेषताओं का मान एक सकारात्मक संख्या है जो पिक्सल या 1 से 100 का प्रतिशत मान दर्शाता है।
फोटो या छवि, विशेषता के साथ वेब पेज के किसी भी हिस्से में रखी जा सकती है "संरेखित", ऊपर (ऊपर), नीचे (नीचे), केंद्र (मध्य), दाएं (दाएं), बाएं (बाएं), आदि पर रखकर।
मान "hspace" इसका उपयोग चित्र के दाईं ओर और बाईं ओर स्थान डालने के लिए किया जाता है, जबकि विशेषता "vspace" पृष्ठ पर ऊपर और नीचे स्थान को अन्य तत्वों से अलग करने के लिए छवि को सम्मिलित करता है।
छवियों का अधिक से अधिक न करें यह केवल एक बेतरतीब और शौकिया पेज की तरह दिखेगा
लोगो या ऐनिमेशन के लिए, GIF चित्र ठीक हैं, जबकि जेपीईजी अधिक जटिल छवियों जैसे कि फोटो के लिए बेहतर हैं।
GIF चित्र केवल 256 रंगों तक 8-बिट रंग का समर्थन करते हैं। यही कारण है कि यदि आप तस्वीरों जैसे रंगों से समृद्ध छवियों के लिए इस प्रारूप का उपयोग करते हैं तो विस्तार का नुकसान अनिवार्य है।
GIF चित्र पारदर्शिता का समर्थन करते हैं एक रंग को पारदर्शी के रूप में सेट किया जा सकता है।
इंटरलिसिंग भी GIF चित्रों द्वारा समर्थित है और यह पूरी तरह भरी हुई होने से पहले छवि का पूर्वावलोकन करने की अनुमति देता है।
GIF प्रारूप एनीमेशन का भी समर्थन करता है।

चेतावनी

अगर इसे अनुमति नहीं है तो गर्म-लिंक न करें!

सामाजिक नेटवर्क पर साझा करें:

संबद्ध