Friday, 16 February 2018


Introduction to HTML

What is an HTML File?

  • एचटीएमएल हाइपर टेक्स्ट मार्कअप भाषा के लिए है
  • एक HTML फ़ाइल एक पाठ फ़ाइल है जिसमें छोटे मार्कअप टैग हैं
  • मार्कअप टैग वेब ब्राउज़र को बताते हैं कि पेज कैसे प्रदर्शित किया जाए
  • एक HTML फ़ाइल में एक htm या html फ़ाइल एक्सटेंशन होना चाहिए
  • एक सरल पाठ संपादक का उपयोग कर एक HTML फ़ाइल बनाई जा सकती है
यदि आप विंडोज चला रहे हैं, नोटपैड शुरू करें

निम्न पाठ में टाइप करें:
<html>
<head>
<title>Title of page</title>
</head>
<body>
This is my first homepage. <b>This text is bold</b>
</body>
</html>
फ़ाइल को "mypage.htm" के रूप में सहेजें

अपना इंटरनेट ब्राउज़र प्रारंभ करें अपने ब्राउज़र के फ़ाइल मेनू में "ओपन" (या "ओपन पृष्ठ") चुनें। एक डायलॉग बॉक्स दिखाई देगा। "ब्राउज" (या "फाइल चुनें") का चयन करें और आपने जो HTML फ़ाइल बनाई है उसे ढूंढें - "mypage.htm" - इसे चुनें और "ओपन" पर क्लिक करें अब आपको डायलॉग बॉक्स में एक पता दिखाना चाहिए, उदाहरण के लिए "C: \ MyDocuments \ mypage.htm"। ठीक क्लिक करें, और ब्राउज़र पृष्ठ प्रदर्शित करेगा।

Example Explained

आपके HTML दस्तावेज़ में पहला टैग <html> है। यह टैग आपके ब्राउज़र को बताता है कि यह एक HTML दस्तावेज़ की शुरुआत है। आपके दस्तावेज़ में अंतिम टैग </ html> है यह टैग आपके ब्राउज़र को बताता है कि यह HTML दस्तावेज़ का अंत है।

<Head> टैग और </ head> टैग के बीच का शीर्ष लेख हैडर की जानकारी है हैडर की जानकारी ब्राउज़र विंडो में प्रदर्शित नहीं की गई है

<Title> टैग्स के बीच का पाठ आपके दस्तावेज़ का शीर्षक है। शीर्षक आपके ब्राउज़र के कैप्शन में दिखाया गया है।

<Body> टैग्स के बीच का टेक्स्ट वह टेक्स्ट है जो आपके ब्राउज़र में प्रदर्शित होगा।

<B> और </ b> टैग के बीच का पाठ बोल्ड फ़ॉन्ट में प्रदर्शित होगा।

HTM or HTML Extension?
                                               जब आप एक HTML फ़ाइल सहेजते हैं, तो आप या तो .htm या .html एक्सटेंशन का उपयोग कर सकते हैं। हमने हमारे उदाहरणों में .एचटीएम का इस्तेमाल किया है। यह अतीत से विरासत में मिली एक बुरी आदत हो सकती है, जब आमतौर पर इस्तेमाल किए गए कुछ सॉफ़्टवेयर ने केवल तीन अक्षर एक्सटेंशन की अनुमति दी थी

नए सॉफ़्टवेयर के साथ हमें लगता है कि यह .html का उपयोग करने के लिए पूरी तरह सुरक्षित होगा।

Note on HTML Editors:-
                                          आप एक सादे पाठ फ़ाइल में अपने मार्कअप टैग लिखने के बजाय एक WYSIWYG (आप जो देखते हैं वह क्या है जो आपको मिल रहा है) संपादक, जैसे FrontPage, Claris होम पेज, या एडोब पेजमिल का उपयोग करके आसानी से एचटीएमएल फ़ाइलों को संपादित कर सकते हैं।

लेकिन यदि आप एक कुशल वेब डेवलपर बनना चाहते हैं, तो हम दृढ़ता से अनुशंसा करते हैं कि आप अपने प्राइमर HTML को जानने के लिए एक सादे टेक्स्ट एडिटर का उपयोग करें।

HTML Elements
HTML documents are text files made up of HTML elements.
HTML elements are defined using HTML tags.

HTML Tags
  • HTML टैग मार्क-अप HTML तत्वों के लिए उपयोग किया जाता है
  • HTML टैग दो अक्षर <और> से घिरे हुए हैं
  • आसपास के पात्रों को कोण ब्रैकेट कहा जाता है
  • एचटीएमएल टैग सामान्य तौर पर <b> और </ b> जैसे जोड़े में आते हैं
  • एक जोड़ी में पहला टैग प्रारंभ टैग है, दूसरे टैग अंत टैग है
  • प्रारंभ और अंत टैग के बीच का पाठ तत्व सामग्री है
  • एचटीएमएल टैग्स केस संवेदी नहीं हैं, <b> इसका मतलब <B> जैसा है
HTML Elements

पिछले पृष्ठ से HTML उदाहरण याद रखें
<html>
<head>
<title>Title of page</title>
</head>
<body>
This is my first homepage. <b>This text is bold</b>
</body>
</html>
यह एक HTML तत्व है
<b>This text is bold</b>

    • प्रारंभिक टैग के साथ HTML तत्व प्रारंभ होता है: <b>
    • एचटीएमएल तत्व की सामग्री है: यह पाठ बोल्ड है
    • HTML तत्व एक अंत टैग के साथ समाप्त होता है: </ b>
    • <B> टैग का उद्देश्य HTML तत्व को परिभाषित करना है जिसे बोल्ड के रूप में प्रदर्शित किया जाना चाहिए।
यह एक HTML तत्व भी है
<body>
This is my first homepage. <b>This text is bold</b>
</body>

यह HTML तत्व प्रारंभ टैग <body> से शुरू होता है, और अंत टैग के साथ समाप्त होता है </ body>

<Body> टैग का उद्देश्य HTML तत्व को परिभाषित करना है जिसमें HTML दस्तावेज़ का मुख्य भाग है।

हम लोअरकेस टैग का उपयोग क्यों करते हैं?

हमने अभी कहा है कि एचटीएमएल टैग संवेदनशील नहीं हैं: <B> इसका मतलब <b> जैसा है। जब आप वेब पर सर्फ करते हैं, तो आप देखेंगे कि ज्यादातर ट्यूटोरियल अपने उदाहरणों में अपरकेस HTML टैग का उपयोग करते हैं। हम हमेशा लोअरकेस टैग का उपयोग करते हैं क्यूं कर?

अगर आप HTML की अगली पीढ़ियों के लिए खुद को तैयार करना चाहते हैं, तो आपको लोअरकेस टैग्स का उपयोग करना शुरू करना चाहिए। वर्ल्ड वाइड वेब कंसोर्टियम (डब्ल्यू 3 सी) ने अपने एचटीएमएल 4 सिफारिश में लोअरकेस टैग की सिफारिश की है, और एक्सएचटीएमएल (अगली पीढ़ी के एचटीएमएल) लोअरकेस टैग की मांग करती है

Tag Attributes

टैग के गुण हो सकते हैं विशेषताएं आपके पृष्ठ पर मौजूद HTML तत्वों के बारे में अतिरिक्त जानकारी प्रदान कर सकती हैं।

यह टैग आपके HTML पृष्ठ के शरीर तत्व को परिभाषित करता है: <body> एक जोड़ा बीजीकलर विशेषता के साथ, आप ब्राउज़र को बता सकते हैं कि आपके पृष्ठ का पृष्ठभूमि का रंग लाल होना चाहिए, जैसे: <body bgcolor = "red">।

यह टैग एक HTML तालिका परिभाषित करता है: <table>। एक अतिरिक्त सीमा विशेषता के साथ, आप ब्राउज़र को बता सकते हैं कि मेज की कोई सीमा नहीं होनी चाहिए: <table border = "0">

गुण हमेशा इस तरह नाम / मूल्य जोड़े में आते हैं: name = "value"

गुण हमेशा एक HTML तत्व के प्रारंभ टैग में जोड़ दिए जाते हैं

Quote Styles, "red" or 'red'?

विशेषता मान हमेशा उद्धरण चिह्नों में संलग्न होना चाहिए। डबल शैली उद्धरण सबसे आम हैं, लेकिन एकल शैली उद्धरण भी अनुमति है।

कुछ दुर्लभ स्थितियों में, जैसा कि विशेषता मान में उद्धरण भी शामिल हैं, एकल उद्धरणों का उपयोग करना आवश्यक है:

नाम = 'जॉन' शॉटगन "नेल्सन '

Basic HTML Tags

The most important tags in HTML are tags that define headings, paragraphs and line breaks.

Headings:-
                     शीर्षकों को <h1> से <h6> टैग के साथ परिभाषित किया गया है <h1> सबसे बड़ा शीर्षक निर्धारित करता है <h6> सबसे छोटा शीर्षक परिभाषित करता है

<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>
<h4>This is a heading</h4>
<h5>This is a heading</h5>
<h6>This is a heading</h6>

HTML स्वचालित रूप से एक शीर्षक के पहले और बाद में एक अतिरिक्त खाली पंक्ति जोड़ता है।

Paragraphs:-

पैराग्राफ को <p> टैग से परिभाषित किया गया है

<p>This is a paragraph</p>
<p>This is another paragraph</p>

HTML स्वचालित रूप से पैराग्राफ से पहले और बाद में एक अतिरिक्त रिक्त पंक्ति जोड़ता है

Line Breaks:-
                        जब आप एक लाइन समाप्त करना चाहते हैं, लेकिन एक नया पैराग्राफ शुरू करने के लिए नहीं चाहते हैं, तो इसका प्रयोग किया जाता है। <br> टैग एक लाइन ब्रेक को बल देता है जहाँ आप इसे जगह देते हैं

<p>This <br> is a para<br>graph with line breaks</p>

टैग एक खाली टैग है। इसमें कोई समापन टैग नहीं है

Comments in HTML:-
                                      टिप्पणी टैग का उपयोग HTML स्रोत कोड में एक टिप्पणी को सम्मिलित करने के लिए किया जाता है। ब्राउज़र द्वारा एक टिप्पणी को अनदेखा कर दिया जाएगा आप अपने कोड की व्याख्या करने के लिए टिप्पणियों का उपयोग कर सकते हैं, जो बाद की तारीख में स्रोत कोड को संपादित करते समय आपकी सहायता कर सकते हैं

<!-- This is a comment -->

ध्यान दें कि आपको उद्घाटन ब्रैकेट के बाद विस्मयादिबोधक बिंदु की आवश्यकता है, लेकिन समापन ब्रैकेट से पहले नहीं।

Basic HTML Tags

      Tag                                                                            Description

<html>                                                                 Defines an HTML document
<body>                                                                Defines the document's body
<h1> to <h6>                                                      Defines header 1 to header 6
<p>                                                                      Defines a paragraph
<br>                                                                     Inserts a single line break
<hr>                                                                     Defines a horizontal rule
<!-->                                                                     Defines a comment

HTML Text Formatting

HTML defines a lot of elements for formatting output, like bold or italic text.

How to View HTML Source

क्या आपने कभी एक वेब पेज देखा है और आश्चर्य है "वे ऐसा कैसे करते हैं?"

पता लगाने के लिए, बस अपने ब्राउज़र्स उपकरण पट्टी में VIEW विकल्प पर क्लिक करें और SOURCE या PAGE SOURCE का चयन करें। यह एक विंडो खुल जाएगा जो आपको पृष्ठ का वास्तविक HTML दिखाता है।

Text Formatting Tags

    Tag                                                                       Description

 <b>                                                                          Defines bold text
 <big>                                                                       Defines big text
 <em>                                                                       Defines emphasized text
 <i>                                                                           Defines italic text
 <small>                                                                    Defines small text
 <strong>                                                                  Defines strong text
 <sub>                                                                      Defines subscripted text
 <sup>                                                                      Defines  super scripted text
<ins>                                                                        Defines inserted text
<del>                                                                        Defines deleted text
<s>                                                                           Deprecated. Use <del> instead
<strike>                                                                    Deprecated. Use <del> instead
<u>                                                                           Deprecated. Use styles instead

HTML Character Entities

<Character की तरह कुछ अक्षर, HTML में एक विशेष अर्थ है, और इसलिए पाठ में उपयोग नहीं किया जा सकता है।
HTML में कम से कम चिह्न (<) प्रदर्शित करने के लिए, हमें एक चरित्र इकाई का उपयोग करना होगा।

Character Entities
                               एचटीएमएल में कुछ अक्षर का एक विशेष अर्थ है, जैसे कि कम से कम चिन्ह (<) जो कि एक HTML टैग की शुरुआत को परिभाषित करता है। अगर हम चाहते हैं कि ब्राउज़र वास्तव में इन अक्षरों को प्रदर्शित करे, तो हमें HTML स्रोत में वर्ण संस्थाओं को सम्मिलित करना होगा।

एक चरित्र इकाई के तीन हिस्से हैं: एक एम्परसेंड (और), एक इकाई का नाम या # और एक इकाई संख्या, और अंत में एक अर्धविराम (;)।

एक HTML दस्तावेज़ में कम से कम साइन इन करने के लिए हमें लिखना होगा: & lt; या <

किसी संख्या के बजाय एक नाम का उपयोग करने का लाभ यह है कि नाम याद रखना आसान है। यह नुकसान यह है कि सभी ब्राउज़र नवीनतम इकाई नामों का समर्थन नहीं करते हैं, जबकि लगभग सभी ब्राउज़रों में इकाई संख्या का समर्थन बहुत अच्छा है।

Note कि संस्थाएं केस संवेदनशील हैं।

Non-breaking Space

एचटीएमएल में सबसे आम चरित्र इकाई गैर-ब्रेकिंग स्पेस है।

सामान्य तौर पर HTML आपके टेक्स्ट में रिक्त स्थान छीन लेगा यदि आप अपने टेक्स्ट HTML में 10 रिक्त स्थान लिखते हैं, तो उनमें से 9 को हटा दिया जाएगा। अपने टेक्स्ट में रिक्त स्थान जोड़ने के लिए, & nbsp; चरित्र इकाई

The Most Common Character Entities:

Result                  Description                         Entity Name                                  Entity Number

                            non-breaking space              &nbsp;                                           &#160;
<                          less than                               &lt;                                                 &#60;
>                           greater than                         &gt;                                                 &#62;
&                         ampersand                           &amp;                                               &#38;
"                         quotation mark                     &quot;                                                &#34;

'                           apostrophe                          &apos;                                               &#39;

Some Other Commonly Used Character Entities:

Result                            Description                       Entity Name                          Entity Number

¢                                      cent                                    &cent;                                     &#162;
£                                      pound                                &pound;                                 &#163;
¥                                      yen                                    &yen;                                      &#165;
§                                     section                                &sect;                                     &#167;
©                                   copyright                            &copy;                                    &#169;
®                                  registered trademark           &reg;                                        &#174;
×                                   multiplication                     &times;                                    &#215;
÷                                   division                               &divide;                                   &#247;

The Anchor Tag and the Href Attribute

एचटीएमएल अन्य दस्तावेज के लिए एक लिंक बनाने के लिए <<(एंकर) टैग का उपयोग करता है

The syntax of creating an anchor:-

<a href="url">Text to be displayed</a>

<a> टैग से लिंक करने के लिए एक एंकर बनाने के लिए उपयोग किया जाता है, href विशेषता को लिंक करने के लिए दस्तावेज़ को संबोधित करने के लिए उपयोग किया जाता है, और एंकर टैग के खुले और बंद के बीच के शब्दों को हाइपरलिंक के रूप में प्रदर्शित किया जाएगा

यह एंकर https://www.facebook.com/tulsilove05/  के लिए एक लिंक परिभाषित करता है

<a href="http://https://www.facebook.com/tulsilove05/ ">Visit https://www.facebook.com/tulsilove05/ !</a>

The Target Attribute:-

लक्ष्य विशेषता के साथ, आप यह निर्धारित कर सकते हैं कि लिंक किए गए दस्तावेज़ कहां खोले जाएंगे।

नीचे दी गई रेखा एक नई ब्राउज़र विंडो में दस्तावेज़ खोलेंगे:

<a href="http://https://www.facebook.com/tulsilove05/"
target="_blank">Visithttps://www.facebook.com/tulsilove05/</a>

The Anchor Tag and the Name Attribute:-
                                                                         नाम विशेषता का उपयोग नामक एंकर बनाने के लिए किया जाता है नाम एंकर का उपयोग करते समय हम उस लिंक को बना सकते हैं जो किसी पृष्ठ पर किसी विशिष्ट अनुभाग में सीधे कूद सकते हैं, उपयोगकर्ता को वह ढूंढने के बजाय उसे ढूंढने के बजाय उसे ढूंढने के बजाय।

नीचे एक नामित एंकर का सिंटैक्स है:

<a name="label">Text to be displayed</a>

नाम विशेषता का उपयोग नामक एंकर बनाने के लिए किया जाता है लंगर का नाम आपके द्वारा उपयोग की जाने वाली किसी भी पाठ का हो सकता है।

नीचे दिया गया नाम एक नामित एंकर को परिभाषित करता है

<a name="tips">Useful Tips Section</a>

आपको ध्यान देना चाहिए कि किसी नामित एंकर को विशेष तरीके से प्रदर्शित नहीं किया जाता है।

"टिप्स" अनुभाग में सीधे लिंक करने के लिए, एक # चिह्न और एंकर का नाम किसी यूआरएल के अंत में जोड़ें, जैसे:

<a href="http://www.facebook.com/tulsilove05//html_links.asp#tips">
Jump to the Useful Tips Section</a>

"Html_links.asp" फ़ाइल में से उपयोगी टिप्स सेक्शन में हाइपरलिंक इस तरह दिखेगा

<a href="#tips">Jump to the Useful Tips Section</a>

Link Tags

Tag                                                             Description

<a>                                                            Defines an anchor

HTML Frames

फ्रेम के साथ, आप एक ही ब्राउज़र विंडो में एक से अधिक वेब पेज प्रदर्शित कर सकते हैं।

Examples

Vertical frameset

यह उदाहरण दर्शाता है कि कैसे तीन अलग-अलग दस्तावेज़ों के साथ एक ऊर्ध्वाधर फ़्रेमसेट बनाने के लिए

Horizontal frameset

यह उदाहरण दर्शाता है कि कैसे तीन अलग-अलग दस्तावेज़ों के साथ एक क्षैतिज फ्रेमसेट बनाने के लिए।

How to use the <noframes> tag

यह उदाहरण दर्शाता है कि <noframes> टैग का उपयोग कैसे करें।

(आप इस पृष्ठ के निचले भाग में अधिक उदाहरण पा सकते हैं)

Frames:-
               फ्रेम के साथ, आप एक ही ब्राउज़र विंडो में एक से अधिक HTML दस्तावेज़ प्रदर्शित कर सकते हैं। प्रत्येक एचटीएमएल दस्तावेज़ को एक फ्रेम कहा जाता है, और प्रत्येक फ्रेम दूसरों से स्वतंत्र है

फ्रेम का उपयोग करने के नुकसान:-

  • वेब डेवलपर को और अधिक HTML दस्तावेज़ों का ट्रैक रखना चाहिए
  • पूरे पृष्ठ को प्रिंट करना मुश्किल है

The Frameset Tag:-

  • <Frameset> टैग परिभाषित करता है कि विंडो को फ़्रेम में कैसे विभाजित किया जाए
  • प्रत्येक फ़्रेमसेट पंक्तियों या स्तंभों का एक सेट परिभाषित करता है
  • पंक्तियों / स्तंभों के मान प्रत्येक पंक्ति / स्तंभ पर कब्जा किए जाने वाले स्क्रीन क्षेत्र की मात्रा को इंगित करते हैं

The Frame Tag

<Frame> टैग परिभाषित करता है कि प्रत्येक फ्रेम में कौन सा HTML दस्तावेज़ रखा जाएगा

नीचे दिए गए उदाहरण में हमारे पास दो कॉलम के साथ एक फ़्रेमसेट है। पहला कॉलम ब्राउज़र विंडो की चौड़ाई के 25% पर सेट है। दूसरा कॉलम ब्राउज़र विंडो की चौड़ाई के 75% पर सेट है एचटीएमएल दस्तावेज़ "फ्रेम_आ एचटीएम" को पहले कॉलम में रखा गया है, और एचटीएमएल दस्तावेज़ "फ्रेम_ बी एचटीएम" दूसरे कॉलम में डाल दिया गया है:

<frameset cols="25%,75%">
<frame src="frame_a.htm">
<frame src="frame_b.htm">
</frameset>
Basic Notes - Useful Tips

अगर किसी फ़्रेम की सीमाएं दिखाई देती हैं, तो उपयोगकर्ता सीमा को खींचकर इसे फिर से बदल सकता है उपयोगकर्ता को ऐसा करने से रोकने के लिए, आप <Frame> टैग पर नोरेसज़ = "noresize" जोड़ सकते हैं।

ब्राउज़रों के लिए <noframes> टैग जोड़ें, जो फ़्रेम का समर्थन नहीं करते हैं

Frame Tags

  Tag                                                  Description

<frameset>                                       Defines a set of frames
<frame>                                            Defines a sub window (a frame)
<noframes>                                       Defines a noframe section for browsers that do not handle frames
<iframe>                                           Defines an inline sub window (frame)

HTML Tables

With HTML you can create tables.

Tables
            टेबल्स <table> टैग से परिभाषित किए गए हैं तालिका को पंक्तियों (<tr> टैग के साथ) में बांटा गया है, और प्रत्येक पंक्ति डेटा कोशिकाओं (<td> टैग के साथ) में विभाजित है। पत्र टीडी "टेबल डेटा" के लिए खड़ा है, जो डेटा सेल की सामग्री है। डेटा सेल में पाठ, चित्र, सूचियों, पैराग्राफ, रूप, क्षैतिज नियम, टेबल इत्यादि हो सकते हैं।

<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
Tables and the Border Attribute:-
                                                        यदि आप बॉर्डर विशेषता को निर्दिष्ट नहीं करते हैं तो तालिका किसी भी सीमाओं के बिना प्रदर्शित की जाएगी। कभी-कभी यह उपयोगी हो सकता है, लेकिन ज्यादातर समय, आप सीमाओं को दिखाने के लिए चाहते हैं।

सीमाओं के साथ तालिका प्रदर्शित करने के लिए, आपको सीमा विशेषता का उपयोग करना होगा:

<table border="1">
11
<tr>
<td>Row 1, cell 1</td>
<td>Row 1, cell 2</td>
</tr>
</table>
Headings in a Table

तालिका में शीर्ष लेख <th> टैग के साथ परिभाषित किए गए हैं

<table border="1">
<tr>
<th>Heading</th>
<th>Another Heading</th>
</tr>
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
Empty Cells in a Table

ज्यादातर ब्राउज़रों में कोई भी सामग्री वाली तालिका कोशिकाओं को बहुत अच्छी तरह से प्रदर्शित नहीं किया जाता है

<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td></td>
</tr>
</table>

ध्यान दें कि रिक्त सारणी सेल के आसपास की सीमाएं गायब हैं

इससे बचने के लिए, सीमाओं को दिखाई देने के लिए, डेटा कोशिकाओं को रिक्त करने के लिए एक गैर-ब्रेकिंग स्पेस (& nbsp;) जोड़ें

<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>&nbsp;</td>
</tr>
</table>

Table Tags

 Tag                                                      Description

<table>                                               Defines a table
<th>                                                    Defines a table header
<tr>                                                    Defines a table row
<td>                                                    Defines a table cell
<caption>                                           Defines a table caption
<colgroup>                                        Defines groups of table columns
<col>                                                 Defines the attribute values for one or more columns in a table
<thead>                                             Defines a table head
<tbody>                                            Defines a table body
<tfoot>                                              Defines a table footer

HTML Lists

HTML supports ordered, unordered and definition lists.

Unordered Lists

एक unordered सूची आइटम की एक सूची है सूची आइटम बुलेट के साथ चिह्नित हैं (आमतौर पर
छोटे काले हलकों)

एक अनोर्ड सूची <ul> टैग से शुरू होती है प्रत्येक सूची आइटम <li> टैग से शुरू होता है

<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>
Here is how it looks in a browser:
  • कॉफ़ी
  • दूध

एक सूची आइटम के अंदर आप पैराग्राफ, लाइन ब्रेक, इमेज, लिंक्स, अन्य सूचियां आदि डाल सकते हैं।

Ordered Lists

एक आदेश सूची में आइटम की एक सूची भी है सूची आइटम नंबरों के साथ चिह्नित हैं

एक आदेश सूची <ol> टैग के साथ शुरू होती है प्रत्येक सूची आइटम <li> टैग से शुरू होता है

<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>

Here is how it looks in a browser:


  • कॉफ़ी
  • दूध

एक सूची आइटम के अंदर आप पैराग्राफ, लाइन ब्रेक, इमेज, लिंक्स, अन्य सूचियां आदि डाल सकते हैं।

Definition Lists

एक परिभाषा सूची आइटमों की सूची नहीं है। यह शब्दों की शर्तों और स्पष्टीकरण की एक सूची है

एक परिभाषा सूची <dl> टैग के साथ शुरू होती है प्रत्येक परिभाषा-सूची शब्द <dt> टैग से शुरू होता है प्रत्येक परिभाषा-सूची परिभाषा <dd> टैग से शुरू होती है

<dl>
<dt>Coffee</dt>
<dd>Black hot drink</dd>
<dt>Milk</dt>
<dd>White cold drink</dd>
</dl>

Here is how it looks in a browser

Coffee

  • Black hot drink

Milk

  • White cold drink

एक परिभाषा-सूची परिभाषा (<dd> टैग) के अंदर आप पैराग्राफ, लाइन ब्रेक, इमेज, लिंक्स, अन्य सूचियां आदि डाल सकते हैं।

List Tags

 Tag                                                                 Description

<ol>                                                                 Defines an ordered list
<ul>                                                                 Defines an unordered list
<li>                                                                  Defines a list item
<dl>                                                                 Defines a definition list
<dt>                                                                 Defines a definition term
<dd>                                                                Defines a definition description
<dir>                                                               Deprecated. Use <ul> instead
<menu>                                                          Deprecated. Use <ul> instead

HTML Forms and Input

HTML Forms are used to select different kinds of user input.

Forms
             एक फार्म एक ऐसा क्षेत्र है जिसमें फ़ॉर्म तत्व शामिल हो सकते हैं।

फ़ॉर्म तत्व तत्व हैं जो उपयोगकर्ता को किसी प्रपत्र में जानकारी (जैसे कि टेक्स्ट फ़ील्ड, टेक्स्टेरा फ़ील्ड, ड्रॉप-डाउन मेनू, रेडियो बटन, चेकबॉक्स, आदि) दर्ज करने की अनुमति देते हैं।

एक फॉर्म <form> टैग से परिभाषित किया गया है


<form>
<input>
<input>
</form>

Input
           सबसे अधिक इस्तेमाल किया फ़ॉर्म टैग <input> टैग है। इनपुट के प्रकार को प्रकार विशेषता के साथ निर्दिष्ट किया गया है। सबसे अधिक इस्तेमाल किया इनपुट प्रकार नीचे समझाया गया है

Text Fields
                   पाठ फ़ील्ड का उपयोग तब किया जाता है जब आप उपयोगकर्ता को किसी प्रपत्र में अक्षरों, संख्याओं आदि लिखना चाहते हैं।

<form>
First name:
<input type="text" name="firstname">
<br>
Last name:
<input type="text" name="lastname">
</form>

ध्यान दें कि प्रपत्र स्वयं दिखाई नहीं दे रहा है यह भी ध्यान रखें कि अधिकांश ब्राउज़रों में, टेक्स्ट फ़ील्ड की चौड़ाई 20 वर्णों का डिफ़ॉल्ट रूप से है

Radio Buttons
                         रेडियो बटन का उपयोग तब किया जाता है जब आप चाहते हैं कि उपयोगकर्ता सीमित विकल्पों में से एक का चयन करें।

<form>
<input type="radio" name="sex" value="male"> Male
<br>
<input type="radio" name="sex" value="female"> Female
</form>
ध्यान दें कि केवल एक विकल्प चुना जा सकता है

Check boxes
                      चेकबॉक्सेस का उपयोग किया जाता है जब आप उपयोगकर्ता को सीमित विकल्पों में से एक या अधिक विकल्प चुनना चाहते हैं।

<form>
<input type="checkbox" name="bike">
I have a bike
<br>
<input type="checkbox" name="car">
I have a car
</form>

The Form's Action Attribute and the Submit Button

जब उपयोगकर्ता "जमा करें" बटन पर क्लिक करता है, तो फॉर्म की सामग्री दूसरी फ़ाइल पर भेजी जाती है। प्रपत्र का एक्शन एट्रिब्यूट सामग्री को भेजने के लिए फ़ाइल का नाम निर्धारित करता है एक्शन विशेषता में परिभाषित फ़ाइल आमतौर पर प्राप्त इनपुट के साथ कुछ करता है

<form name="input" action="html_form_action.asp"
method="get">
Username:
<input type="text" name="user">
<input type="submit" value="Submit">
</form>

यदि आप उपरोक्त टेक्स्ट फ़ील्ड में कुछ अक्षर टाइप करते हैं, और "सबमिट करें" बटन क्लिक करें, तो आप "html_form_action.asp" नामक पृष्ठ पर अपना इनपुट भेजेंगे। वह पृष्ठ आपको प्राप्त इनपुट दिखाएगा।

Form Tags

 Tag                                                    Description

<form>                                              Defines a form for user input
<input>                                              Defines an input field
<textarea>                                         Defines a text-area (a multi-line text input control)
<label>                                              Defines a label to a control
<fieldset>                                          Defines a fieldset
<legend>                                           Defines a caption for a fieldset
<select>                                            Defines a selectable list (a drop-down box)
<optgroup>                                      Defines an option group
<option>                                          Defines an option in the drop-down box
<button>                                          Defines a push button
<isindex>                                        Deprecated. Use <input> instead

HTML Images

With HTML you can display images in a document.

The Image Tag and the Src Attribute

एचटीएमएल में, छवियों को <img> टैग से परिभाषित किया जाता है

<Img> टैग खाली है, जिसका अर्थ है कि इसमें केवल विशेषताएँ हैं और इसमें कोई समापन टैग नहीं है

किसी पृष्ठ पर एक छवि प्रदर्शित करने के लिए, आपको src विशेषता का उपयोग करना होगा। Src "स्रोत" के लिए खड़ा है Src विशेषता का मूल्य उस छवि का यूआरएल है जिसे आप अपने पृष्ठ पर प्रदर्शित करना चाहते हैं।

एक छवि को परिभाषित करने का वाक्यविन्यास:

<img src="url">
यूआरएल उस स्थान को इंगित करता है जहां छवि संग्रहीत होती है। "www.facebook.com/tulsilove05" पर निर्देशिका "चित्र" में स्थित "नाव.gif" नाम की एक छवि में यूआरएल है: http://www.facebook.com/tulsilove05

ब्राउज़र उस छवि को डालता है जहां दस्तावेज़ में छवि टैग होता है। यदि आप दो पैराग्राफ के बीच एक छवि टैग डालते हैं, तो ब्राउज़र पहला पैराग्राफ दिखाता है, फिर छवि, और फिर दूसरा पैराग्राफ।

The Alt Attribute

एक छवि के लिए "वैकल्पिक पाठ" को परिभाषित करने के लिए Alt विशेषता का उपयोग किया जाता है Alt विशेषता का मूल्य लेखक-परिभाषित पाठ है:

<img src="boat.gif" alt="Big Boat">

"ऑल्ट" विशेषता पाठक को बताती है कि यदि वह पृष्ठ छवि पर लोड नहीं कर सकता है तो वह पृष्ठ पर अनुपलब्ध है। ब्राउज़र फिर छवि के बजाय वैकल्पिक पाठ प्रदर्शित करेगा। यह एक अच्छा अभ्यास है जिसमें एक पृष्ठ पर प्रत्येक छवि के लिए "ऑल्ट" विशेषता को शामिल किया जा सकता है, अपने दस्तावेज़ की डिस्प्ले और उपयोगिता को सुधारने के लिए, जिनके पास पाठ-केवल ब्राउज़र्स हैं

Image Tags

 Tag                                                    Description

<img>                                                 Defines an image
<map>                                                Defines an image map
<area>                                                Defines an area inside an image map

HTML Backgrounds\

एक अच्छी पृष्ठभूमि एक वेब साइट वास्तव में महान लग सकता है।

Backgrounds

<Body> टैग के दो गुण हैं जहां आप पृष्ठभूमि को निर्दिष्ट कर सकते हैं। पृष्ठभूमि एक रंग या एक छवि हो सकती है

Bgcolor 

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

<body bgcolor="#000000">
<body bgcolor="rgb(0,0,0)">
<body bgcolor="black">

सभी ऊपर दी गई रेखाएं पृष्ठभूमि रंग को काले रंग में सेट करें

Background

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

<body background="clouds.gif">
<body background="http://www.facebook.com/tulsilove05"

यूआरएल रिश्तेदार (ऊपर की पहली पंक्ति के रूप में) या पूर्ण (ऊपर दूसरी पंक्ति के रूप में) हो सकता है।

HTML Fonts

HTML में <font> टैग बहिष्कृत है इसे एचटीएमएल के भविष्य के संस्करण में हटाया जाना माना जाता है

यहां तक कि अगर बहुत से लोग इसे प्रयोग कर रहे हैं, तो आपको इसे से बचने की कोशिश करनी चाहिए और इसके बजाय शैलियों का उपयोग करना चाहिए।

The HTML <font> Tag

इस तरह HTML कोड के साथ, आप दोनों आकार और ब्राउज़र आउटपुट के प्रकार को निर्दिष्ट कर सकते हैं

<p>
<font size="2" face="Verdana">
This is a paragraph.
</font>
</p>
<p>
<font size="3" face="Times">
This is another paragraph.
</font>
</p>

Font Attributes

Attribute                                       Example                                                Purpose

size="number"                             size="2"                                              Defines the font size
size="+number"                           size="+1"                                           Increases the font size
size="-number"                            size="-1"                                            Decreases the font size
face="face-name"                        face="Times"                                     Defines the font-name
color="color-value"                     color="#eeff00"                                 Defines the font color
color="color-name"                     color="red"                                        Defines the font color

<Font> टैग का उपयोग नहीं किया जाना चाहिए

<Font> टैग को एचटीएमएल के नवीनतम संस्करण (एचटीएमएल 4 और एक्सएचटीएमएल) में पदावनत किया गया है।















my page name hacker

No comments:

Post a Comment

INDIAN CRIME

INDIAN CRIME INDIAN CRIME India bhot bda desh h jis karan se isme crime bhot bd rha h lakin iske badne or na khatam hone ka karan...