एचटीएमएल इंस्टांस
- पिछला पृष्ठ एचटीएमएल5 SSE
- अगला पृष्ठ एचटीएमएल असेसमेंट
HTML बेसिक टैग इंस्टांस
- एक साधारण HTML फ़ाइल
- यह उदाहरण एक बहुत ही साधारण HTML फ़ाइल है जो अधिकतम लघु HTML टैग का उपयोग करती है। यह आपको दिखाता है कि body एलिमेंट में कैसे ब्राउज़र द्वारा प्रदर्शित किया जाता है。
- साधारण पैराग्राफ
- इस उदाहरण में: पैराग्राफ एलिमेंट में टेक्स्ट कैसे ब्राउज़र द्वारा प्रदर्शित किया जाता है को दिखाया गया है。
- अधिक पैराग्राफ
- इस उदाहरण में पैराग्राफ एलिमेंट के कुछ डिफ़ॉल्ट व्यवहार को दिखाया गया है。
- गद्य की समस्या
- इस उदाहरण में HTML फॉर्मैटिंग के कुछ समस्याओं को दिखाया गया है。
- फ़ोल्डिंग
- इस उदाहरण में HTML दस्तावेज़ में फ़ोल्डिंग के उपयोग को दिखाया गया है。
- 标题
- 本例演示在 HTML 文档中显示标题的标签。
- केंद्रित शीर्षक
- यह उदाहरण देता है कि कैसे HTML दस्तावेज़ में एक केंद्रित शीर्षक दिखाया जाता है
- होगा लेनड्राइव
- होगा यह उदाहरण देता है कि कैसे एक लेनड्राइव जोड़ा जाता है
- छिपी टिप्पणी
- HTML स्रोत कोड में छिपी टिप्पणी जोड़ने के लिए कैसे इस्तेमाल किया जाता है
- पृष्ठभूमि रंग
- यह उदाहरण देता है कि कैसे HTML पृष्ठ को पृष्ठभूमि रंग जोड़ा जाता है
HTML टेक्स्ट फॉर्मेटिंग उदाहरण
- टेक्स्ट फॉर्मेटिंग
- HTML फ़ाइल में टेक्स्ट को फॉर्मेट करना
- प्री-फॉर्मेटिड टेक्स्ट
- pre टैग के द्वारा खाली पंक्ति और खाली जगह को नियंत्रित करने के लिए कैसे इस्तेमाल किया जाता है
- "कंप्यूटर आउटपुट" टैग
- विभिन्न "कंप्यूटर आउटपुट" टैग के प्रदर्शन
- ठिकाना
- HTML फ़ाइल में ठिकाना लिखना
- अक्षरशब्द और अक्षरक्षर
- अक्षरों का अक्षरशब्द और अक्षरक्षर शब्द
- लिखाई की दिशा
- यह उदाहरण देता है कि कैसे लिखाई की दिशा को बदला जाता है
- ब्लॉक उदाहरण
- अलग-अलग लंबाई वाले उदाहरण का इस्तेमाल करना
- निकाला गया टेक्स्ट और जोड़ा गया टेक्स्ट का चिह्न
- यह उदाहरण देता है कि कैसे निकाला गया टेक्स्ट और जोड़ा गया टेक्स्ट को चिह्नित किया जाता है
HTML लिंक उदाहरण
- सुपरलिंक बनाना
- HTML दस्तावेज़ में लिंक बनाना
- चित्र को लिंक के रूप में इस्तेमाल करना
- यह उदाहरण देता है कि कैसे चित्र को लिंक के रूप में इस्तेमाल किया जाता है
- नए ब्राउज़र विंडो में लिंक खोलना
- एक नए ब्राउज़र विंडो में पृष्ठ खोलना, इस तरह आगंतुक को आपके साइट से बाहर नहीं जाना पड़ेगा
- एक ही पृष्ठ के अलग-अलग स्थानों को लिंक करना
- यह उदाहरण देता है कि कैसे लिंक के द्वारा दस्तावेज़ के दूसरे हिस्से को लिंक किया जाता है
- फ्रेम से बाहर निकलना
- यह उदाहरण देता है कि कैसे फ्रेम से बाहर निकला जाता है, अगर आपका पृष्ठ फ्रेम के भीतर फंसा हुआ है।
- ईमेल लिंक बनाना
- यह उदाहरण देता है कि कैसे ईमेल पर लिंक किया जाता है। (यह ईमेल क्लायंट प्रोग्राम स्थापित होने के बाद काम करता है।)
- ईमेल लिंक बनाना 2
- अधिक जटिल ईमेल लिंक का उदाहरण
HTML फ्रेम उदाहरण
- ऊर्ध्व फ्रेम
- यह उदाहरण देता है कि कैसे तीन अलग-अलग दस्तावेज़ों से एक ऊर्ध्व फ्रेम बनाया जाता है।
- आड़ा फ्रेम
- यह उदाहरण देता है कि कैसे तीन अलग-अलग दस्तावेज़ों से एक आड़ा फ्रेम बनाया जाता है।
- कैसे <noframes> टैग का इस्तेमाल किया जाता है
- यह उदाहरण देता है कि <noframes> टैग का इस्तेमाल कैसे किया जाता है।
- मिश्रित फ्रेम संरचना
- यह उदाहरण देता है कि कैसे तीन दस्तावेज़ों वाली फ्रेम संरचना बनायी जाती है और उन्हें साथ-साथ पंक्ति और स्तम्भ में मिलाया जाता है।
- noresize="noresize" विशेषता वाले फ्रेम संरचना
- यह उदाहरण देता है कि noresize विशेषता का इस्तेमाल कैसे किया जाता है। इस उदाहरण में, फ्रेम के आकार को संयमित किया जाता है। फ्रेम के बीच की सीमा पर माउस खींचने के बाद, आपको लगेगा कि सीमा गतिशील नहीं है।
- नेविगेशन फ्रेम
- यह उदाहरण देता है कि कैसे नेविगेशन फ्रेम बनाया जाता है। नेविगेशन फ्रेम एक लिंक सूची शामिल है जो दूसरे फ्रेम को लक्ष्य के रूप में रखता है। फ़ाइल "contents.htm" में तीन लिंक हैं।
- 内联框架
- इस इंस्टांस में इनलाइन फ्रेम (HTML पन्ने में फ्रेम) कैसे बनाया जाता है, इसे दिखाया गया है。
- फ्रेम के भीतर के निर्दिष्ट खण्ड को जाना
- फ्रेम के भीतर के निर्दिष्ट खण्ड को जाना
- नेविगेशन के लिए फ्रेम के भीतर के निर्दिष्ट खण्ड को जाना
- इस इंस्टांस में दो फ्रेम का इस्तेमाल करके नेविगेशन जाने के लिए दिखाया गया है। बाएं ओर का नेविगेशन फ्रेम एक लिंक सूची को शामिल करता है, जिसमें दूसरा फ्रेम लक्ष्य के रूप में इस्तेमाल किया जाता है। दूसरा फ्रेम लिंकड की दस्तावेज़ को दिखाता है। नेविगेशन फ्रेम के भीतर के लिंक लक्ष्य फाइल में निर्दिष्ट खण्ड की ओर जाने के लिए संकेत करते हैं。
HTML तालिका इंस्टांस
- तालिका
- इस इंस्टांस में HTML दस्तावेज़ में तालिका कैसे बनाया जाता है, इसे दिखाया गया है。
- तालिका किनारा
- इस इंस्टांस में विभिन्न प्रकार के किनारे के तालिका को दिखाया गया है。
- बिना किनारे की तालिका
- इस इंस्टांस में बिना किनारे की तालिका को दिखाया गया है。
- तालिका में शीर्षक (Heading)
- इस इंस्टांस में कैसे तालिका शीर्षक को दिखाया जाता है, इसे दिखाया गया है。
- रिक्त कोष्ठ
- इस इंस्टांस में " " का इस्तेमाल करके शीर्षक रिक्त कोष्ठ को कैसे दिखाया जाता है, इसे दिखाया गया है。
- शीर्षक वाली तालिका
- इस इंस्टांस में एक शीर्षक (caption) वाली तालिका को दिखाया गया है。
- पार्श्ववर्ती या पार्श्ववर्ती कोष्ठ कोष्ठ
- इस इंस्टांस में कैसे एक या अधिक कोष्ठ कोष्ठ को पार्श्ववर्ती या पार्श्ववर्ती करना, इसे दिखाया गया है。
- तालिका के भीतर टैग
- इस इंस्टांस में विभिन्न तत्वों के भीतर तत्वों को कैसे दिखाया जाता है, इसे दिखाया गया है。
- कोष्ठ कोष्ठ बीच का अंतर (Cell padding)
- इस इंस्टांस में Cell padding का इस्तेमाल करके कोष्ठ सामग्री और किनारा के बीच खाली जगह बनाने के लिए दिखाया गया है。
- कोष्ठ कोष्ठ अंतर (Cell spacing)
- कोष्ठ कोष्ठ के बीच की दूरी बढ़ाने के लिए Cell spacing का इस्तेमाल करना
- तालिका में पृष्ठभूमि रंग या पृष्ठभूमि छवि जोड़ना
- तालिका में पृष्ठभूमि जोड़ना
- कोष्ठ कोष्ठ में पृष्ठभूमि रंग या पृष्ठभूमि छवि जोड़ना
- इस इंस्टांस में किनारा फोन्ट कोष्ठ में कैसे जोड़ा जाता है, इसे दिखाया गया है。
- तालिका कोष्ठ में सामग्री को जगह देना
- इस इंस्टांस में "align" एट्रिब्यूट का इस्तेमाल करके कोष्ठकों के भीतर सामग्री को जगह देने के लिए एक सुंदर तालिका बनाने के लिए दिखाया गया है。
- फ्रेम (frame) एट्रिब्यूट
- इस इंस्टांस में "frame" एट्रिब्यूट का इस्तेमाल करके तालिका के चारों ओर किनारा नियंत्रित करने के लिए दिखाया गया है。
HTML सूची इंस्टांस
- अनुक्रमित सूची
- इस इंस्टांस में अनुक्रमित सूची को दिखाया गया है。
- अनुक्रमित सूची
- इस इंस्टांस में अनुक्रमित सूची को दिखाया गया है。
- विभिन्न प्रकार की अनुक्रमित सूची
- इस इंस्टांस में एक अनुक्रमित सूची को दिखाया गया है。
- विभिन्न प्रकार की अनुक्रमित सूची
- इस इंस्टांस में विभिन्न प्रकार की अनुक्रमित सूची को दिखाया गया है。
- निम्नस्थ सूची
- इस इंस्टांस में निम्नस्थ सूची को कैसे निम्नस्थ किया जाता है, इसे दिखाया गया है。
- निम्नस्थ सूची 2
- इस इंस्टांस में अधिक जटिल निम्नस्थ सूची दिखाया गया है。
- डिफाइनिशन सूची
- इस इंस्टांस में एक डिफाइनिशन सूची दिखाया गया है。
HTML फॉर्म और इनपुट इंस्टांस
- 文本域(Text fields)
- 本例演示如何在 HTML 页面创建文本域。用户可以在文本域中写入文本。
- 密码域
- 本例演示如何创建 HTML 的密码域。
- 复选框
- 本例演示如何在 HTML 页中创建复选框。用户可以选中或取消选取复选框。
- 单选按钮
- 本例演示如何在 HTML 中创建单选按钮。
- 简单的下拉列表
- 本例演示如何在 HTML 页面中创建简单的下拉列表框。下拉列表框是一个可选列表。
- 另一个下拉列表
- 本例演示如何创建一个简单的带有预选值的下拉列表。（译者注：预选值指预先指定的首选项。）
- 文本域(Textarea)
- 本例演示如何创建一个文本域（多行文本输入控件）。用户可以在文本域中写入文本。在文本域中，可写入的字符字数不受限制。
- 创建按钮
- 本例演示如何创建按钮。你可以对按钮上的文字进行自定义。
- Fieldset around data
- 本例演示如何在数据周围绘制一个带标题的框。
表单实例
- इस उदाहरण में दिखाया गया है कि किस तरह HTML पृष्ठ में एक टेक्सट फील्ड बनाया जा सकता है। उपयोगकर्ता टेक्सट फील्ड में लिख सकते हैं।
- पासवर्ड फील्ड
- इस उदाहरण में दिखाया गया है कि किस तरह HTML को पासवर्ड फील्ड बनाया जा सकता है。
- चेकबॉक्स
- इस उदाहरण में दिखाया गया है कि किस तरह HTML पृष्ठ में एक चेकबॉक्स बनाया जा सकता है। उपयोगकर्ता चेकबॉक्स को चुन सकते हैं या नहीं चुन सकते हैं。
- रेडियो बटन
- इस उदाहरण में दिखाया गया है कि किस तरह HTML में एक रेडियो बटन बनाया जा सकता है。
- साधारण द्रष्टव्य चयन लिस्ट
इस उदाहरण में दिखाया गया है कि किस तरह HTML पृष्ठ पर एक आसान द्रष्टव्य चयन लिस्ट बोक्स बनाया जा सकता है। द्रष्टव्य चयन लिस्ट बोक्स एक वृत्तीय लिस्ट है।
- एक और द्रष्टव्य चयन लिस्ट
- इस उदाहरण में दिखाया गया है कि किस तरह एक आसान द्रष्टव्य चयन लिस्ट बनाया जा सकता है। (अनुवादक के टिप्पणी: द्रष्टव्य चयन लिस्ट एक पूर्व-निर्धारित विकल्प है।)
- टेक्सट एरिया (टेक्सट फील्ड्स)
- इस उदाहरण में दिखाया गया है कि किस तरह एक टेक्सट एरिया (बहु-पद टेक्स्ट इनपुट कंट्रोल) बनाया जा सकता है। उपयोगकर्ता टेक्सट एरिया में लिख सकते हैं। टेक्सट एरिया में लिखे जा सकने वाले अक्षरों की संख्या को नियंत्रित नहीं किया जाता है。
- बटन बनाना
- इस उदाहरण में दिखाया गया है कि किस तरह बटन बनाया जा सकता है। आप बटन पर लिखे गए लेख को स्वयं अनुकूलित कर सकते हैं。
- डेटा के चारों ओर फील्डसेट
- इस उदाहरण में दिखाया गया है कि किस तरह एक पृष्ठ में बैग्रॉफ के चारों ओर बैग्रॉफड को बनाया जा सकता है。
- इमेज जगह देना
- इस उदाहरण में दिखाया गया है कि किस तरह इमेज को लेख में जगह दिलाया जा सकता है。
- फ्लोट इमेज
- इस उदाहरण में दिखाया गया है कि किस तरह इमेज को पैराग्राफ के बाईं या दायं ओर फ्लोट किया जा सकता है。
- इमेज आकार समायोजित करना
- इस उदाहरण में दिखाया गया है कि किस तरह इमेज को अलग-अलग आकार में दिखाया जा सकता है।
- इमेज लिंक बनाना
- इस उदाहरण में दिखाया गया है कि किस तरह एक इमेज को लिंक के रूप में इस्तेमाल किया जाता है。
- इमेज मैप बनाना
- इस उदाहरण में दिखाया गया है कि किस तरह एक इमेज मैप को बनाया जाता है जिसमें क्लिक करने योग्य क्षेत्र हैं। इसमें से प्रत्येक क्षेत्र एक सुपरलिंक है。
- चित्र को इमेज मैप में बदलना
- इस उदाहरण में दिखाया गया है कि किस तरह एक साधारण चित्र को इमेज मैप के रूप में सेट किया जाता है。
HTML पृष्ठभूमि उदाहरण
- अच्छा जुड़े पृष्ठभूमि और रंग
- एक पृष्ठभूमि और लेख रंग के अच्छा जुड़े उदाहरण, जो पृष्ठ में किताबों को पढ़ने में आसान बनाता है。
- अच्छा नहीं जुड़े पृष्ठभूमि और रंग
- 一个背景颜色和文字颜色搭配得不好的例子，使页面中的文字难于阅读。
- 可用性强的背景图像
- 背景图像和文字颜色使页面文本易于阅读的例子。
- उपयोगीता समर्थन वाले पृष्ठभूमि चित्र 2
- एक पृष्ठभूमि चित्र और लेख का रंग जो पृष्ठ लेख को पढ़ने में आसान है
- एक पृष्ठभूमि चित्र और लेख का रंग जो पृष्ठ लेख को पढ़ने में मुश्किल पाने वाले है
- उपयोगीता घाटे वाले पृष्ठभूमि चित्र
पृष्ठ लेख को पढ़ने में मुश्किल पाने वाले पृष्ठभूमि चित्र का उदाहरण
- एचटीएमएल शैली (style) उदाहरण
- एचटीएमएल में शैली
- इस उदाहरण में दिखाया गया है कि कैसे <head> भाग में जोड़ी गई शैली जानकारी का उपयोग करके एचटीएमएल को फॉर्मैट किया जाए।
- अनुच्छेदहीन लिंक
- एक बाहरी शैली तालिका से जोड़ा जाता है
- इस उदाहरण में दिखाया गया है कि कैसे <link> टैग को एक बाहरी शैली तालिका से जोड़ा जाए।
एचटीएमएल शीर्ष (head) उदाहरण
- दस्तावेज़ की शीर्ष
- शीर्ष तत्व के भीतर की शीर्ष जानकारी ब्राउज़र विंडो में दिखाई नहीं देती है。
- एक target, सभी लिंक
- इस उदाहरण में दिखाया गया है कि कैसे base टैग का उपयोग करके पृष्ठ के सभी टैगों को नए विंडो में खोला जाए।
एचटीएमएल मेटा (मेटा) उदाहरण
- दस्तावेज़ वर्णन
- मेटा तत्व में जानकारी को एचटीएमएल दस्तावेज़ को वर्णित किया जा सकता है。
- दस्तावेज़ के प्रमुख शब्द
- मेटा तत्व में जानकारी को दस्तावेज़ के प्रमुख शब्दों के रूप में वर्णित किया जा सकता है。
- पुनर्निर्देशन
- इस उदाहरण में दिखाया गया है कि जब यूरीस में परिवर्तन कर दिया गया है तो उपयोगकर्ता को दूसरी एड्रेस को भेजा जाता है।
एचटीएमएल स्क्रिप्ट (स्क्रिप्ट) उदाहरण
- एक स्क्रिप्ट जोड़ें
- एचटीएमएल दस्तावेज़ में स्क्रिप्ट जोड़ने का उदाहरण
- स्क्रिप्ट को नहीं समर्थन करने वाले ब्राउज़र पर चलाया जाता है
- इस उदाहरण में दिखाया गया है कि कैसे निर्दोष एचटीएमएल ब्राउज़रों को समर्थन नहीं करते हैं।
- पिछला पृष्ठ एचटीएमएल5 SSE
- अगला पृष्ठ एचटीएमएल असेसमेंट
