web

Types of HTML Tags & It’s Attributes

by
with no comment
Contents hide
1 HTML Tags
1.1 Structural Tags
1.2 Text Tags
1.3 List Tag
1.4 HTML Image Tag

HTML Tags

HTML (Hyper Text Markup Language) एक Standard Markup Language है, जिसका Use Web Page Create करने के लिए किया जाता है। HTML Tags, Webpage के Building Block होते हैं, और Page का Structure, Layout और Content को Define करते हैं।

Structural Tags

Structural Tags, Web Page के Overall Structure को Define करते हैं। इन Tags में <html>, <head>, <body> और <title> Included होते हैं।

  • HTML, Document के Root Element को Define करने के लिए <html> Tag का use किया जाता है। अन्य सभी Tag <html> Tag के भीतर Contained होते हैं।
  • <head> Tag का use HTML Document के Head Section को Define करने के लिए किया जाता है। Head Section में Document के बारे में Meta Information होती है, जैसे Title और External Stylesheets और Script के Link।
  • HTML Document के Body Section को Define करने के लिए <body> Tag का use किया जाता है। Body Section में वह Content होते है, जो Page पर Display होती है।
  • <title> Tag का use HTML Document के Title को Define करने के लिए किया जाता है, जो Browser के Title Bar में Display होता है।

Example

<html>

<head>

<title>My Webpage</title>

</head>

<body>

<h1>Welcome to My Webpage</h1>

<p>This is the content of my webpage.</p>

</body>

</html>

Output

html tags

Text Tags

Text Tag, Web Page के Text Content को Define करते हैं। इन Tag में <h1> से <h6>, <p>, <a>, <em>, <strong>, <sup>, <sub>, और <br> Included होते हैं।

  • <h1> से <h6> Tag का use विभिन्न Size के Heading को Define करने के लिए किया जाता है। <h1> Tag सबसे Largest Heading है, और <h6> Tag सबसे Small Heading है।
  • <p> Tag का use Text के Paragraph को Define करने के लिए किया जाता है।
  • <a> Tag का use अन्य Web Page या Resource के लिए Hyperlinks बनाने के लिए किया जाता है। Resource के URL को Specify करने के लिए href Attribute का use किया जाता है।
  • <em> Tag का use Text को Italic करने के लिए किया जाता है।
  • <strong> Tag का Use Text को Bold करने के लिए किया जाता है।
  • <sup> Tag का Use Superscript Text बनाने के लिए किया जाता है।
  • Subscript Text बनाने के लिए <sub> Tag का use किया जाता है।
  • <br> Tag का Use Break Line बनाने के लिए किया जाता है।

Example





<html>


<head>


<title>My Webpage</title>


</head>


<body>


<h1>Heading Level 1</h1>


<p>This is a paragraph of text.</p>


<a href=”https://www.example.com”>Link to Example Website</a>


<strong>This text is bold.</strong>


<sup>Superscript Text</sup>


  </body>


</html>

Output

html tags

List Tag

List Tag, Ordered और Unordered List को Define करते हैं। इन Tag में <ul>, <ol>, <li> Include होते हैं।

  • <ul> Tag का use एक Unordered List को Define करने के लिए किया जाता है। प्रत्येक List Item को <li> Tag के साथ Define किया गया है। Type Attribute का प्रयोग करके इनकी Styling को भी Chnage कर सकते है| Type Attribute की निम्नलिखित Values हो सकती है –
  • disc – यह List Item को Bullet में Set करता है।
  • circle – इसके द्वारा List Item को Circle में Set किया जाता है।
  • square – यह List Item को Square में Set करता है।
  • none – इसके द्वारा List Item का Decoration दिखाई नहीं देता है।

Example



<!DOCTYPE html>


<html>


<head>


<title>HTML List Example</title>


</head>


<body>


<ul type=”square”>


<li>Computer</li>


<li>Tablet</li>


<li>Mobile</li>


</ul>


</body>


</html>

Output

html tags

  • <ol> Tag का Use Order List को Define करने के लिए किया जाता है। प्रत्येक List Item को <li> Tag के साथ Define किया गया है।

The Type Attribute in Ordered List

Ordered List में type Attribute का use List Style Type को Define करने के लिए किया जाता है| By Default <ol> List में List Items के लिए “Number” का use किया जाता है|

  1. Number (Default) – 1
  2. Uppercase Letter – A
  3. Lowercase Letter – a
  4. Uppercase Roman Number – I
  5. Lowercase Roman Number – i
  6. None

Example



<!DOCTYPE html>


<html>


<head>


<title>HTML List Example</title>


</head>


<body>


<ul type=”I”>


<li>Computer</li>


<li>Tablet</li>


<li>Mobile</li>


</ul>


</body>


</html>

HTML Image Tag

Image Webpage को ज्यादा Attractive और Beautiful बनाते है| Readers भी बिना Image के साथ बनाए गए Webpage की Comparison में Image के साथ बनाए गए Pages को ज्यादा Like करते है| इसलिए HTML में Image Element को जोडा गया है| Image Element का use HTML Document (Webpage) में Picture Insert करने के लिए किया जाता है| <img> Tag द्वारा Image को Define किया जाता है|

एक HTML Document में विभिन्न Format में Images को Insert किया जा सकता है| आप PNG, JPEG, GIFs, आदि Format में Image को Add कर सकते है| हम जिस भी Format में Image को Use करना चाहते है, उस Format को Mention करना पड़ता है|

Image Element Attribute

  • src – इस Attribute का use Image के Source URL को Define करता है|
  • alt – इस Attribute का use Image के बारे में Information Provide करने के लिए किया जाता है|
  • style – Style Attribute से Image पर CSS Rules को Apply किया जाता है|
  • width & height – ये दोनो Attributes अलग-अलग use किए जाते है| इनके द्वारा Image के Width और Height को Define किया जाता है|
  • align – इसके द्वारा Image Alignment को Define किया जाता है|
  • border – Image Border को Border Attribute से Define किया जाता है|
  • title – Image को Title देने के लिए इस Attribute का use किया जाता है|
Post Views: 317
Tags: No tags

Add a Comment

Your email address will not be published. Required fields are marked *