HTML iframe टैग एक वेब दस्तावेज़ को वेब पेज पर एम्बेड करता है। एक एम्बेडेड दस्तावेज़ एक पीडीएफ, एक वेब पेज या कोई अन्य संपत्ति हो सकती है। src विशेषता एम्बेडेड संसाधन के स्थान को परिभाषित करती है।
आप HTML का उपयोग करके एक वेब दस्तावेज़ की सामग्री को एम्बेड कर सकते हैं, जैसे कि Google मानचित्र से कोई PDF या मानचित्र, दूसरे पृष्ठ पर।
यहीं पर HTML में आता है। HTML टैग का उपयोग बाहरी वस्तुओं जैसे अन्य वेब पेजों को एक वेब पेज में एम्बेड करने के लिए किया जाता है। यह ट्यूटोरियल उदाहरणों के साथ चर्चा करेगा कि HTML का उपयोग कैसे करें वेब संसाधनों को वेब पेज में एम्बेड करने के लिए टैग।
एचटीएमएल आईफ्रेम
HTML iframes, या इनलाइन फ़्रेम, एक पृष्ठ पर बाहरी वेब दस्तावेज़ प्रदर्शित करते हैं। आप
इनलाइन फ्रेम में संग्रहीत कोड शेष वेब पेज से स्वतंत्र होता है। आपके वेब पेज पर लागू होने वाली कोई भी शैली या जावास्क्रिप्ट आईफ्रेम के भीतर लागू नहीं होगी।
यहाँ HTML के लिए वाक्य रचना है टैग:
टैग का उपयोग आईफ्रेम बनाने के लिए किया जाता है। हमने एक iframe निर्दिष्ट किया है src गुण। विशेषता में HTML तत्वों का स्थान होता है जिसे हम अपने वेब पेज पर एम्बेड करना चाहते हैं। यह एक HTML URL होना चाहिए।
iframe HTML कोड उदाहरण
आइए एक उदाहरण के माध्यम से देखें कि कैसे टैग काम करता है।
81% प्रतिभागियों ने कहा कि बूटकैंप में भाग लेने के बाद उन्हें अपनी तकनीकी नौकरी की संभावनाओं के बारे में अधिक आत्मविश्वास महसूस हुआ। आज ही एक बूटकैंप से मिलान करें।
बूटकैंप शुरू करने से लेकर अपनी पहली नौकरी खोजने तक, औसत बूटकैंप ग्रेड ने करियर संक्रमण में छह महीने से भी कम समय बिताया।
मान लीजिए हम एक स्थानीय वाशिंगटन, डीसी ऐतिहासिक समाज के लिए एक वेबसाइट बना रहे हैं। वे चाहते हैं कि हम अमेरिकी संविधान के जन्म पर खान अकादमी के एक एम्बेडेड वीडियो के साथ एक पेज बनाएं। समाज में शामिल होने के इच्छुक किसी भी व्यक्ति के लिए यह पृष्ठ अनुशंसित सामग्री है। हम वीडियो को अपनी वेबसाइट में एम्बेड करने के लिए निम्नलिखित कोड का उपयोग कर सकते हैं:
हमारा कोड लौटाता है:
हमने एक . का इस्तेमाल किया हमारे वेब पेज पर बाहरी वेब संसाधन एम्बेड करने के लिए तत्व। हमने जो वेब संसाधन एम्बेड किया है वह "https://www.youtube.com/embed/Rk8dCnKIfP4" लिंक है। यह उस वीडियो की ओर इशारा करता है जिसे ऐतिहासिक समाज अपनी वेबसाइट पर दिखाना चाहता है।
एचटीएमएल आईफ्रेम ऊंचाई और चौड़ाई
ऊंचाई विशेषता और चौड़ाई विशेषता का उपयोग आईफ्रेम के आकार को सेट करने के लिए किया जाता है। मान लीजिए कि स्थानीय वाशिंगटन डी.सी. ऐतिहासिक समाज चाहता है कि हम उनकी साइट पर वीडियो को बड़ा करें।
हम YouTube वीडियो की चौड़ाई 500 पिक्सेल और ऊँचाई 300 पिक्सेल सेट करने जा रहे हैं:
हमारा कोड लौटाता है:
हमारा एम्बेडेड वीडियो अब हमारे HTML दस्तावेज़ पर 500 पिक्सेल चौड़ा और 300 पिक्सेल लंबा है। इससे लोगों के लिए वेबसाइट पर हमारे वीडियो को देखना आसान हो जाता है।
वैकल्पिक रूप से, हम CSS का उपयोग करके iframe टैग की चौड़ाई और ऊंचाई निर्धारित कर सकते हैं। लेकिन, चूंकि HTML ऊंचाई और वजन विशेषता का समर्थन करता है, इसलिए यह आवश्यक नहीं है।
HTML iframe बॉर्डर हटाएं
जब आप . के साथ काम कर रहे हों टैग, आप देखेंगे कि इसकी सामग्री एक सीमा से घिरी हुई है। यदि आप इस सीमा को हटाना चाहते हैं, तो आप सीमा:कोई नहीं; . का उपयोग कर सकते हैं सीएसएस विशेषता।
ऐतिहासिक समाज ने हमें अपनी साइट से YouTube वीडियो के चारों ओर की सीमा को हटाने के लिए कहा है। यहां वह कोड है जिसका उपयोग हम सीमा को हटाने के लिए करेंगे:
हमारा कोड लौटाता है:
हमारे वीडियो की अब कोई सीमा नहीं है।
HTML iframe लिंक लक्ष्य
इसके अलावा, टैग का उपयोग लिंक के लिए लक्ष्य फ्रेम के रूप में किया जा सकता है। हम एक HTML लिंक में लक्ष्य विशेषता का उपयोग करके एक लिंक के लिए लक्ष्य फ्रेम के रूप में एक आईफ्रेम सेट कर सकते हैं। लक्ष्य HTML विशेषता को . के नाम विशेषता को संदर्भित करना चाहिए ।
मान लीजिए कि ऐतिहासिक समाज के पास एक और वीडियो था जो वे चाहते थे कि हम अमेरिकी संविधान के अनुच्छेद I पर अपनी वेबसाइट पर दिखाएं। यह वीडियो भी खान अकादमी द्वारा प्रकाशित किया गया था।
जब पाठ जन्म वेब पेज पर क्लिक किया जाता है, अमेरिकी संविधान का जन्म वीडियो आईफ्रेम में प्रस्तुत किया जाना चाहिए। जब पाठ अनुच्छेद I क्लिक किया जाता है, संविधान के अनुच्छेद I पर वीडियो प्रस्तुत किया जाना चाहिए।
हम इस कार्य को पूरा करने के लिए निम्नलिखित कोड का उपयोग कर सकते हैं:
जन्म
अनुच्छेद Iहमारा कोड लौटाता है:
डिफ़ॉल्ट रूप से, यू.एस. संविधान के जन्म पर वीडियो iframe में दिखाया गया है। आईफ्रेम की सामग्री संविधान के अनुच्छेद I पर खान अकादमी के वीडियो की ओर इशारा करती है। यह तब होता है जब हम अनुच्छेद I . पर क्लिक करते हैं यूआरएल.
अगर हम जन्म पर क्लिक करते हैं तो हमारा आईफ्रेम संविधान के जन्म पर वीडियो पर रीडायरेक्ट कर दिया जाता है यदि वह वीडियो पहले से प्रदर्शित नहीं होता है ।
निष्कर्ष
HTML टैग बाहरी वेब संसाधनों जैसे वेब पेजों को दूसरे वेब पेज पर एम्बेड करता है। यदि आप अपनी साइट पर मानचित्र, फ़ाइलें, वीडियो या अन्य वेब पेज जोड़ना चाहते हैं तो यह उपयोगी है।
इस ट्यूटोरियल में, उदाहरणों के संदर्भ में, HTML . का उपयोग कैसे करें, पर चर्चा की गई वेब पेज पर बाहरी वेब संसाधनों को प्रस्तुत करने के लिए टैग। अब आपके पास . का उपयोग शुरू करने के लिए आवश्यक ज्ञान है एक समर्थक की तरह टैग करें!
HTML में कोडिंग के बारे में अधिक जानने के लिए, हाइपरटेक्स्ट मार्कअप लैंग्वेज सीखने के लिए हमारा गाइड पढ़ें।