HTML Frames
फ़्रेम एक
ब्राउज़र विंडो को कई टुकड़ों या पैन में विभाजित करता है, प्रत्येक फलक में एक अलग एक्सएचटीएमएल / एचटीएमएल दस्तावेज़
होता है। एक प्रमुख लाभ जो फ्रेम ऑफर करता है वह यह है कि आप ब्राउज़र विंडो की
संपूर्ण सामग्री को फिर से लोड किए बिना एकल पैन को लोड और पुनः लोड कर सकते हैं।
ब्राउज़र विंडो में फ़्रेम का एक संग्रह फ़्रेमसेट के रूप में जाना जाता है। खिड़की को एक
समान पैटर्न में फ्रेम में विभाजित किया जाता है जिस तरह से तालिकाओं को व्यवस्थित
किया जाता है: पंक्तियों और स्तंभों में।
फ़्रेमसेट का सबसे सरल स्क्रीन को केवल
दो पंक्तियों में विभाजित कर सकता है, जबकि एक जटिल फ्रेमसेट
कई पंक्तियों और स्तंभों का उपयोग कर सकता है।
कुछ कमियां भी
हैं जिनके बारे में आपको पता होना चाहिए कि फ्रेम निम्नानुसार हैं:
1 कुछ ब्राउज़र
फ़्रेमसेट से अच्छी तरह से प्रिंट नहीं होते हैं।
2 कुछ छोटे उपकरण
फ्रेम के साथ सामना नहीं कर सकते, अक्सर क्योंकि
उनकी स्क्रीन को विभाजित करने के लिए पर्याप्त बड़ा नहीं होता है।
3 कुछ समय में
आपके पेज को अलग-अलग स्क्रीन पर अलग-अलग स्क्रीन रिज़ॉल्यूशन के कारण अलग-अलग
प्रदर्शित किया जाएगा।
4 उपयोगकर्ता की
आशा के अनुसार ब्राउज़र का बैक बटन काम नहीं कर सकता है।
5 अभी भी कुछ
ब्राउज़र हैं जो फ़ार्म तकनीक का समर्थन नहीं करते हैं।
फ़्रेमसेट
दस्तावेज़ बनाने के लिए,
पहले आपको < frameset > तत्व की आवश्यकता
होती है, जिसका उपयोग <body> तत्व के बजाय किया जाता है। फ़्रेमसेट पंक्तियों को
परिभाषित करता है और आपके पृष्ठ को कॉलम में विभाजित किया जाता है, जो बदले में निर्दिष्ट करता है कि प्रत्येक व्यक्ति फ़्रेम
कहाँ जाएगा। प्रत्येक फ्रेम को तब एक < frames > तत्व द्वारा दर्शाया जाता है।
आपको <noframes> तत्व को भी सीखने की ज़रूरत है, जो उन उपयोगकर्ताओं के लिए एक संदेश प्रदान करता है जिनके
ब्राउज़र फ़्रेम का समर्थन नहीं करते हैं।
Creating Frames
- The <frameset> Element:
1 < frameset > टैग तख्ते
दस्तावेजों में <body> तत्व को प्रतिस्थापित करता है।
2 < frameset > टैग परिभाषित
करता है कि खिड़की को फ्रेम में कैसे विभाजित किया जाए।
3 प्रत्येक
फ़्रेमसेट पंक्तियों या स्तंभों के एक सेट को परिभाषित करता है। यदि आप पंक्तियों
का उपयोग करके फ़्रेम को परिभाषित करते हैं तो क्षैतिज फ़्रेम बनाए जाते हैं। यदि
आप स्तंभों का उपयोग करके फ़्रेम को परिभाषित करते हैं तो ऊर्ध्वाधर खेत बनाए जाते
हैं।
4 पंक्तियों /
स्तंभों के मूल्यों से संकेत मिलता है कि प्रत्येक पंक्ति / स्तंभ पर स्क्रीन
क्षेत्र की मात्रा कितनी होगी।
5 प्रत्येक
फ़ार्मे को < frame> टैग द्वारा
दर्शाया गया है और यह परिभाषित करता है कि फ्रेम में HTML दस्तावेज़ क्या है।
अब हम इन टैग्स
पर एक-एक करके विस्तार से चर्चा करेंगे।
|
<html>
<head>
<title>Frames
example</title>
</head>
<frameset rows="10%,80%,10%">
<frame
src="/html/top_frame.htm" />
<frame
src="/html/main_frame.htm" />
<frame
src="/html/bottom_frame.htm" />
<noframes>
<body>
Your browser does not support frames.
</body>
</noframes>
</frameset>
</html>
|
The <frameset> Element Attributes:
<frameset> की महत्वपूर्ण विशेषताएं निम्नलिखित हैं और
आपको फ्रेमसेट का उपयोग करने के लिए जाना जाना चाहिए।
1 cols: निर्दिष्ट करता है कि फ़्रेमसेट और प्रत्येक
कॉलम के आकार में कितने कॉलम समाहित हैं। आप प्रत्येक स्तंभ की चौड़ाई को चार
तरीकों में से एक में निर्दिष्ट कर सकते हैं:
a पिक्सेल में पूर्ण मान। उदाहरण के लिए तीन
ऊर्ध्वाधर फ्रेम बनाने के लिए, cols = "100, 500,100" का
उपयोग करें।
b ब्राउज़र विंडो का एक प्रतिशत। उदाहरण के लिए
तीन ऊर्ध्वाधर फ्रेम बनाने के लिए, cols = "10%, 80%, 10%" का उपयोग करें।
c वाइल्डकार्ड प्रतीक का उपयोग करना। उदाहरण के
लिए तीन ऊर्ध्वाधर फ्रेम बनाने के लिए, cols = "10%, *, 10%" का
उपयोग करें। इस स्थिति में वाइल्डकार्ड विंडो के शेष लेता है।
d ब्राउज़र विंडो के सापेक्ष चौड़ाई के रूप में।
उदाहरण के लिए तीन ऊर्ध्वाधर फ्रेम बनाने के लिए, cols = "3 *, 2 *, 1 *" का
उपयोग करें। यह प्रतिशत के लिए एक विकल्प है। आप ब्राउज़र विंडो के सापेक्ष चौड़ाई
का उपयोग कर सकते हैं। यहां खिड़की को छठे में विभाजित किया गया है: पहला कॉलम
खिड़की के आधे हिस्से को लेता है, दूसरा एक तिहाई लेता है, और तीसरा एक छठा
लेता है।
2 पंक्तियाँ(rows): विशेषता बछड़ों की विशेषता की तरह ही काम
करती है और समान मान ले सकती है, लेकिन इसका उपयोग तख्ते में पंक्तियों को निर्दिष्ट करने के लिए किया जाता है।
उदाहरण के लिए दो क्षैतिज फ्रेम बनाने के लिए, पंक्तियों का उपयोग करें = "10%, 90%"। आप प्रत्येक पंक्ति की ऊँचाई उसी
तरह निर्दिष्ट कर सकते हैं जैसे कि स्तंभों के लिए ऊपर बताई गई है।
3 बॉर्डर:
विशेषता पिक्सेल में प्रत्येक फ़्रेम की सीमा को निर्दिष्ट करती है। उदाहरण के लिए
सीमा = "5"। शून्य का मान निर्दिष्ट करता है कि कोई सीमा नहीं होनी
चाहिए।
4 फ़्रेमबॉर्डरframeborder: निर्दिष्ट करता है कि फ़्रेम के बीच एक
त्रि-आयामी सीमा प्रदर्शित की जानी चाहिए या नहीं। यह एट्रुब्यूट 1 (हाँ) या 0
(नहीं) का मूल्य लेता है। उदाहरण के लिए फ्रेमबॉर्डर = "0" कोई सीमा
नहीं निर्दिष्ट करता है।
5 फ्रेमस्पेसिंग framespacing: एक फ्रेमसेट में फ्रेम के बीच की जगह की
मात्रा को निर्दिष्ट करता है। यह किसी भी पूर्णांक मान को ले सकता है। उदाहरण के
लिए तख्ते = "10" का अर्थ है कि प्रत्येक तख्ते के बीच 10 पिक्सेल का
अंतर होना चाहिए।
Loading Content - The <frame> Element:
<frame> तत्व इंगित करता
है कि फ़्रेमसेट के प्रत्येक फ़्रेम में क्या जाता है। <frame> तत्व हमेशा एक खाली तत्व होता है, और इसलिए इसमें कोई भी सामग्री नहीं होनी चाहिए, हालांकि प्रत्येक <frame> तत्व को उस पृष्ठ को दर्शाने के लिए पेज को
इंगित करने के लिए हमेशा एक विशेषता, src ले जाना चाहिए।
उपरोक्त उदाहरण
से, आप छोटे स्निपेट
ले सकते हैं:
|
<frame
src="/html/top_frame.htm" />
<frame
src="/html/main_frame.htm" />
<frame
src="/html/bottom_frame.htm" />
|
तत्व गुण:
निम्नलिखित
महत्वपूर्ण विशेषताएं हैं और आपको फ़्रेम का उपयोग करने के लिए जाना जाना चाहिए।
1 src: उस फ़ाइल को
इंगित करता है जिसका उपयोग फ्रेम में किया जाना चाहिए। इसका मूल्य कोई भी URL हो सकता है। उदाहरण के लिए, src = "/ html /
top_frame.htm" HTML निर्देशिका में
एक HTML फ़ाइल avaible को लोड करेगा।
2 name: विशेषता आपको एक फ़्रेम को एक नाम देने की
अनुमति देती है। यह इंगित करने के लिए उपयोग किया जाता है कि किस फ़्रेम को एक
दस्तावेज़ में लोड किया जाना चाहिए। यह विशेष रूप से महत्वपूर्ण है जब आप एक फ्रेम
में लिंक बनाना चाहते हैं जो पृष्ठों को दूसरे फ्रेम में लोड करता है, उस स्थिति में दूसरे फ्रेम को लिंक के लक्ष्य
के रूप में खुद को पहचानने के लिए एक नाम की आवश्यकता होती है।
3 frameborder: विशेषता निर्दिष्ट करती है कि उस फ़्रेम की
सीमाएँ दर्शाई गई हैं या नहीं; यह फ्रेमवर्क मोड में दिए गए मूल्य को <फ्रेमसेट> तत्व पर ओवरराइड
करता है यदि कोई दिया गया है, और संभव मान समान हैं। यह मानों को 1 (हाँ) या 0 (नहीं) ले सकता है।
4 marginwidth: आप फ्रेम की सीमाओं और फ्रेम की सामग्री के
बाएँ और दाएँ के बीच की जगह की चौड़ाई निर्दिष्ट करने की अनुमति देता है। पिक्सल
में मूल्य दिया जाता है। उदाहरण के लिए मार्जिन = "10"।
5 marginheight: आपको फ्रेम की सीमाओं और इसकी सामग्री के ऊपर
और नीचे के बीच की जगह की ऊंचाई निर्दिष्ट करने की अनुमति देता है। पिक्सल में
मूल्य दिया जाता है। उदाहरण के लिए मार्जिन = "10"।
6 noresize: डिफ़ॉल्ट रूप से
आप किसी फ्रेम की सीमाओं पर क्लिक करके और खींचकर किसी भी फ्रेम का आकार बदल सकते
हैं। Noresize विशेषता
उपयोगकर्ता को फ़्रेम का आकार बदलने में सक्षम होने से रोकता है। उदाहरण के लिए noresize =
"noresize"।
7 scrolling: स्क्रॉलबार की
उपस्थिति को नियंत्रित करता है जो फ्रेम पर दिखाई देता है। यह मानों को "हाँ", "नहीं" या "ऑटो" लेता है। उदाहरण
के लिए स्क्रॉलिंग = "नहीं" का अर्थ है कि इसमें स्क्रॉल बार नहीं होना
चाहिए।
8 longdesc: आपको फ़्रेम की
सामग्री के लंबे विवरण वाले किसी अन्य पृष्ठ का लिंक प्रदान करने की अनुमति देता
है। उदाहरण के लिए longdesc = "framedescription.htm"
ब्राउज़र समर्थन
- <noframes> तत्व: Browser Support - The <noframes> Element:
यदि कोई
उपयोगकर्ता किसी पुराने ब्राउज़र या किसी भी ब्राउज़र का उपयोग कर रहा है जो
फ़्रेम का समर्थन नहीं करता है, तो <noframes> तत्व को
उपयोगकर्ता को प्रदर्शित किया जाना चाहिए।
XHTML में आपको <noframes> तत्व के अंदर <body> तत्व रखना चाहिए क्योंकि <फ्रेमसेट> तत्व को <body> तत्व को
प्रतिस्थापित करना है, लेकिन यदि कोई
ब्राउज़र <फ्रेमसेट> तत्व को नहीं समझता है तो उसे समझना चाहिए कि
अंदर क्या है <noframes> तत्व में निहित <body> तत्व।
Inline Frames - The <iframe> Element:
आप <iframe> टैग के साथ एक इनलाइन फ्रेम को परिभाषित कर सकते हैं। <Iframe> टैग का उपयोग <frame> टैग के भीतर नहीं किया जाता है। इसके बजाय, यह आपके दस्तावेज़ में कहीं भी दिखाई देता है। <Iframe> टैग दस्तावेज़ के भीतर एक आयताकार क्षेत्र को परिभाषित करता
है जिसमें ब्राउज़र स्क्रॉलबार और सीमाओं सहित एक अलग दस्तावेज़ प्रदर्शित करता
है।
इनलाइन फ़्रेम पर
मौजूद दस्तावेज़ का URL निर्दिष्ट करने के लिए <iframe> के साथ src विशेषता का उपयोग
करें।
नाम, वर्ग,
फ्रेमवर्क, आईडी,
लॉन्गडेस्क, मार्जिन, मार्जिन, नाम,
स्क्रॉलिंग, शैली और शीर्षक सहित <iframe> टैग के लिए अन्य
सभी वैकल्पिक विशेषताएँ <ढ्डह्म> टैग के लिए
संबंधित विशेषताओं की तरह ही व्यवहार करती हैं।
<Iframe> का उपयोग करने का तरीका दिखाने के लिए
निम्नलिखित उदाहरण है। इस टैग का उपयोग <body> टैग के साथ किया
जाता है:
संरेखित विशेषता
आपको यह नियंत्रित करने देती है कि फ़्रेम को आसन्न पाठ के अनुरूप कहां रखा गया है
या दस्तावेज़ के किनारे पर स्थानांतरित कर दिया गया है, जिससे पाठ को फ़्रेम के चारों ओर प्रवाह करने की अनुमति
मिलती है।
इनलाइन अलाइनमेंट
के लिए, इस विशेषता के मान के रूप में शीर्ष, मध्य या नीचे का उपयोग करें। फ्रेम को क्रमशः आसन्न पाठ के
शीर्ष, मध्य या नीचे के साथ संरेखित किया गया है। पाठ
को इनलाइन फ़्रेम के चारों ओर प्रवाह करने की अनुमति देने के लिए, इस विशेषता के लिए बाएँ या दाएँ मान का उपयोग करें। फ़्रेम
को क्रमशः पाठ प्रवाह के बाएं या दाएं किनारे पर ले जाया जाता है, और दस्तावेज़ की शेष सामग्री को फ़्रेम के चारों ओर
प्रवाहित किया जाता है। केंद्र का मान डिस्प्ले के बीच में इनलाइन फ्रेम को रखता
है, जिसमें ऊपर और नीचे टेक्स्ट बहता है।
आप अपने
उपयोगकर्ता के लिए पुराने ब्राउज़र वाले कुछ अच्छे संदेश डाल सकते हैं। उदाहरण के
लिए क्षमा करें !! आपका ब्राउज़र फ्रेमों का समर्थन नहीं करता है।
HTML Lists Formatting
आप सूची के रूप
में अपने आइटम, विषयों या मेनू को सूचीबद्ध कर सकते हैं। HTML आपको तीन अलग-अलग प्रकार की सूचियाँ देता है।
<ul> - एक अव्यवस्थित सूची। यह गोलियों का उपयोग करके
वस्तुओं को सूचीबद्ध करेगा
<ol> - एक आदेशित सूची। यह आपके आइटमों को सूचीबद्ध
करने के लिए संख्याओं की विभिन्न योजनाओं का उपयोग करेगा
<dl> - एक परिभाषा सूची। यह आपके आइटमों को उसी तरह
व्यवस्थित करता है जैसे वे एक शब्दकोश में व्यवस्थित होते हैं।
HTML अनअॉर्डर लिस्ट:
एक अनियंत्रित
सूची संबंधित वस्तुओं का एक संग्रह है जिसमें कोई विशेष क्रम या अनुक्रम नहीं है।
वेब पर आपको मिलने वाली सबसे सामान्य अव्यवस्थित सूची अन्य दस्तावेजों के लिए
हाइपरलिंक का एक संग्रह है।
यह सूची <ul> टैग का उपयोग करके बनाई गई है। सूची में प्रत्येक आइटम
बटललेट के साथ चिह्नित है। बुलेट अपने आप में तीन फ्लेवर में आती है: स्क्वायर, डिस्क और सर्कल। अधिकांश वेब ब्राउज़र द्वारा प्रदर्शित
डिफ़ॉल्ट बुलेट पारंपरिक पूर्ण डिस्क है।
एक मूवी सूची
नीचे दी गई है:
|
<center>
<h2>Movie List</h2>
</center>
<ul>
<li>Ram
Teri Ganga Meli</li>
<li>Mera
Naam Jocker</li>
<li>Titanic</li>
<li>Ghost
in the ship</li>
</ul>
|
Movie
List
- Ram Teri Ganga Meli
- Mera Naam Jocker
- Titanic
- Ghost in the ship
आप इसमे कइे अलग अलग प्रकार की बुलेटका प्रयोग कर सकते है।
HTML Ordered Lists:
ठेठ ब्राउज़र एक
आदेशित सूची की सामग्री को एक अनियंत्रित सूची की तरह प्रारूपित करता है, सिवाय इसके कि आइटम बुलेटेड के बजाय गिने जाते हैं।
क्रमांकन एक से शुरू होता है और प्रत्येक क्रमिक क्रम सूची तत्व के लिए एक से बढ़
जाता है जिसे <li>
के साथ टैग किया गया है
यह सूची <ol> टैग का उपयोग करके बनाई गई है। सूची में प्रत्येक आइटम को
एक संख्या के साथ चिह्नित किया गया है।
एक मूवी सूची
नीचे दी गई है:
|
<center>
<h2>Movie List</h2>
</center>
<ol>
<li>Ram
Teri Ganga Meli</li>
<li>Mera
Naam Jocker</li>
<li>Titanic</li>
<li>Ghost
in the ship</li>
</ol>
|
Movie
List
1.
Ram Teri Ganga Meli
2.
Mera Naam Jocker
3.
Titanic
4.
Ghost in the ship
आप इसमे कई
प्रकार के एट्रीब्युट का प्रयोग कर सकते है
|
<ol
type="I"> - Upper-Case Numerals.
<ol
type="i"> - Lower-Case Numerals.
<ol
type="a"> - Lower-Case Letters.
<ol
type="A"> - Upper-Case Letters.
|
|
<ol type="I">
|
<ol type="i">
|
<ol type="a">
|
<ol type="A">
|
|
I.
Hindi
II.
English
III.
Maths
IV.
Physics
|
i.
Hindi
ii.
English
iii.
Maths
iv.
Physics
|
a.
Hindi
b.
English
c.
Maths
d.
Physics
|
A.
Hindi
B.
English
C.
Maths
D.
Physics
|
|
<center>
<h2>Movie List</h2>
</center>
<ol
start="5">
<li>Ram
Teri Ganga Meli</li>
<li>Mera
Naam Jocker</li>
<li>Titanic</li>
<li>Ghost
in the ship</li>
</ol>
|
आउटपुट
Movie
List
5.
Ram Teri Ganga Meli
6.
Mera Naam Jocker
7.
Titanic
8.
Ghost in the ship
HTML Definition Lists:
एचटीएमएल और
एक्सएचटीएमएल भी एक सूची शैली का समर्थन करते हैं जो कि अब तक चर्चा की गई क्रमबद्ध
और अनियंत्रित सूचियों से पूरी तरह से अलग है। जैसे आप एक शब्दकोश या विश्वकोश, पाठ, चित्रों और अन्य मल्टीमीडिया तत्वों के साथ पूरा करते हैं, परिभाषा सूची एक शब्दावली, शब्दों की सूची, या अन्य नाम / मूल्य सूची प्रस्तुत करने का
आदर्श तरीका है।
परिभाषा सूची
निम्नलिखित तीन टैग का उपयोग करती है।
- <dl> - Defines the start of the list
- <dt> - A term
- <dd> - Term definition
- </dl> - Defines the end of the list
<dl>
<dt><b>HTML</b></dt>
<dd>This stands for Hyper Text Markup Language</dd>
<dt><b>HTTP</b></dt>
<dd>This stands for Hyper Text Transfer Protocol</dd>
</dl>
|
HTML
This stands for Hyper Text Markup Language
HTTP
This stands for Hyper Text Transfer Protocol
Appropriate List Usage:
निम्नलिखित केवल
एक सुझाव हैं और उनका उपयोग करने के लिए कोई कठिन और तेज़ नियम नहीं है:(Following are just a suggestion and there
is no hard and fast rule to use them:)
1 Link
collections (लिंक संग्रह)
2 Short,
nonsequenced groups of text (पाठ के लघु, गैर-परिणामी समूह)
3 Emphasizing
the high points of a presentation (एक प्रस्तुति के उच्च बिंदुओं पर जोर देना)
Use ordered lists for:
1 Tables of
contents(सामग्री की
तालिकाएँ)
2 Sets of
sequential sections of text(पाठ के अनुक्रमिक वर्गों के समूह)
3 Assigning
numbers to short phrases that can be referenced elsewhere(छोटे वाक्यांशों को संख्याएँ सौंपना जिन्हें
अन्यत्र संदर्भित किया जा सकता है)
Use definition
lists for:
1 Glossaries(शब्दावलियों)
2 Custom
bullets - make the item after the <dt> tag an icon-sized bullet image)
3 Any list of name/value pairs
No comments:
Post a Comment
Please Do Not Enter Any Spam Link in the comment Box.