ALL Types of Tags in HTML with Example

all types of html

html tag के प्रकार को ले के students में काफी विषंगतियाँ है ज्यादा तर students को यह पता ही नहीं होता है की html में tag कितने प्रकार के होते है और कौन कौन होते है। तो चलिए जानते है की html में tag के कुल कितने प्रकार होते है ( What Types of Tags in HTML ) और कौन-कौन होते है।

यदि आपको यह पता नहीं है की एचटीएमएल क्या है तो आपको What is HTML in Hindi लेख को जरूर पढ़ना चाहिए।

HTML Tag

एचटीएमएल एक hypertax markup language है जिसको पढ़ना बहुत ही easy होता है। इसके सहायता से web Page बनाया जाता है।

HTML में Tag एक प्रकार के keyword की तरह ही होता है जो html में यह दर्शाता है की Web Browser, web समाग्री को कैसे प्रदर्शित करेगा।

Example of HTML Tags

HTML TagsHTML Tags Name
<body>body Tag of a webpage
<hr>Horizontal Tag
<P>paragraph tag
<H1> to <H6>Heading Tags
<head>head Tag
<i>Italic Tag

 

Types of tags in html ( एचटीएमएल में टैग के प्रकार )

HTML में Tags सामान्यतः दो प्रकार के होते है( There are Two types of HTML Tags )।

  1. Container Tag
  2. Empty Tag

Container Tags ( एचटीएमएल में Container Tags )

HTML Container Tags के दो भाग Opening Tag and Closing Tag होता है। और इन दोनों टैग के बिच में Content होता है। सबसे Important बात की उस Tag का प्रभाव बीच में उपस्थित Content पे सीधा पड़ता है।

जैसे:- ” <i> ReadEsy </i>

यहाँ <i>__</i> ” Italic tag है जो अपने अंदर आने वाले Text “ReadEsy” को कुछ इस प्रकार ReadEsy Italic कर देता है।

Example of Italic Tags :-

Container Tag के अन्य नाम है( Container tag also Called ) –

  • Paired Tag
  • Semantic Tags
  • Closing Tags

Container & Paired Tags list

  • <html>……..</html>
  • <head>…….</head>
  • <title>…….</title>
  • <body>…….</body>
  • <p>……</p>
  • <font>…….</font>
  • <div>…….</div>
  • <ol>…….</ol>
  • <ul>…….</ul>
  • <section>……</section>
  • <table>……</table>
  • <form>…….</form>

Empty Tags in HTML ( HTML में Empty Tags क्या होता है? )

HTML Empty Tags के केवल एक भाग Opening Tag होता है। इस टैग को लिखने के बाद उसे बंद करने की कोई जरुरत नहीं होती है।

Example:- image Tag , horizontal Tag

Empty Tags के अन्य नाम है ( Empty Tags also Called ) –

  • Singular tags
  • Stand-alone Tags
  • Unpaired Tags
  • Self Closing Tags

list of Empty tags in HTML & HTML5

Si.No.Empty Tagsa different way of writing a different way of writing
1.<br><br/></br>
2.<hr><hr/></hr>
3.<img><img/></img>
4.<area><area/></area>
5.<source><source/></source>
6.<base><base/></base>
7.<Param><Param/></Param>
8.<Link><Link/></Link>
9.<meta><meta/></meta>
10.<input><input/></input>
11.<wbr><wbr/></wbr>
12.<track><track/></track>

 

इनको Close करने की जरुरत नहीं होती है। लेकिन अगर आप इसे close करना चाहे तो कर सकते है, कोई असर नहीं होगा।

इन्हे भी पढ़ें :-

What is HTML in Hindi

What are tags in html

Inline HTML Tags – एचटीएमएल में inline टैग्स

Inline tag height and width के अनुसार area Consume करते है। Inline Tags उतना ही लम्बाई एवं चौड़ाई लेता है जितना उसे आवश्यकता होता है

Example of Inline Tag

<strong>Hello Word</strong>

यहाँ Hello Word जब browser में देखा जायेगा तो आप पाएंगे की यह उतना ही लाइन cover किये हुए है, जितना उसे आवश्यकता है। 

HTML Inline Tags List

<a><kbd><script>
<abbr><iframe><i>
<b><textarea><object>
<br><time><map>
<big><label><img>
<tt><input><secect>
<acronym><button><bdo>
<cite><sup><samp>
<dfn><sub><small>
<em><span><q>
<code><strong><var>

 

Block Level Tags in HTML

HMTL में Block Level Tags हमेशा एक नई लाइन से शुरू होता है। Block Level Tag text के अनुसार fullwidth consume करता है। यह अपने line में किसी दूसरे line को नहीं आने देता है ।

<div> Block Level tag है जो HTML Document में एक division को परिभासित करता है।

Block Level Tags Example

<div> Hello word</div>

<h2> Heading2 </h2>

List of Block Level HTML Tags

  • <p>
  • <h1>to <h6>
  • <address>
  • <blockquote>
  • <dl>
  • <pre>
  • <div>
  • <fieldset>
  • <frameset>
  • <table>
  • <ol>
  • <ul>
  • <noscript>
  • <hr>
  • <form>

Semantic Tags

आपने बहुत सारे Tags देखे होंगे जैसे <span> और <div> जिनसे स्पस्ट नहीं होता है की यह टैग से क्या changing होने वाला है लेकिन Semantic tags Browser और Developer दोनों को एक साथ बताता है की इस Tag में क्या होने वाला है। ( A Semantic element Clearly describes its Meaning to both the browser and the developer. )

Example of semantic Tag

< from > from tag है जिससे clearly पता चल रहा है की from tag का उपयोग from बनाने में किया जायेगा।

< header > इससे भी पता चलता है की यह Header Tag browser में Header को define करेगा।

Note:- Semantic tags SEO में काफी ज्यादा help करता है।

Semantic Tags List

  • <article>
  • <aside>
  • <header>
  • <footer>
  • <main>
  • <mark>
  • <details>
  • <nav>
  • <summary>
  • <time>
  • <figcaption>
  • <section>
  • <figure>
  • <from>
  • <table>
  • <title>

Leave a Comment