-->

HTML Tags

Introduction to HTML Tags

An HTML file is a combination of tags and text. HTML tags are also called HTML elements. If you understand the concept of tags, you can easily understand HTML. Because HTML works solely through tags

When HTML was designed in the beginning, it was used only to display text in WebPages. At that time HTML was very limited and there were only few tags in it. The process of displaying text in WebPages by HTML tags was called marking text. This is why HTML was called text markup language.

At that time, HTML was used by just computer scientists who published their papers via HTML on the world wide web so that other scientists could read them. But the HTML was so simple and effective that it became very popular and many people started using it.

Slowly as soon as the HTML became popular, the need to show different elements in WebPages increased. Now HTML is not just a text markup language. Now you can insert various types of elements such as lists, tables images, audio, video, graphics etc. into WebPages via HTML.

Elements (lists, tables, images, video, etc.) are inserted in HTML tags only in any webpage. Whatever you want to add to the webpage will be added by tags only. HTML provides you many tags for this. All these tags are familiar with the interpreter.

Interpreter is a program that happens in all web browsers. This program recognizes HTML tags and shows them the meaning of text, images, list and tables corresponding to the same in the web page.

By basically tags, you tell the interpreter what you want to display in the webpage. For example, if you want to add an image to a webpage, you will define <img> tag in its HTML file.

The purpose of most HTML tags can be understood only by their name. For example, <table> tag is used to insert table in webpage. As you start using them, you can easily remember what a particular tag is used for.

Syntax of HTML Tags

Generally there are 3 parts of the HTML tag. Opening tag is initially applied. This lets the interpreter know what you are going to do. After the opening tag, the text is written on which this tag is being applied. After this the closing tag is written.

The interpreter from the closing tag realizes that this tag was still used. To separate the closing tag from the opening tag, the forward slash is applied in the closing tag.

The general syntax of HTML tags is being given below.

<tagName> text </ tagName>

Not all HTML tags are cloned by the closing tag. There are also HTML tags that are only defined by the opening tag. Such tags are called empty tags. Their syntax is being given below.

<tagName>

There are also some types of tags in HTML that are defined by both the opening and closing parts of the same part. The name of the first tag is written in it, followed by the forward slash. Their syntax is being given below.

<tagName />

Types of HTML Tags

There are many types of tags available in HTML: Some tags are used to format the text, so some are included to use multimedia elements such as imaging, audio, video etc..

Some tags of HTML are used to create different structures, such as tables, sections, and lists, etc. Some tags also work like containers, inside which define another tag which is its sub tags.

All types of HTML tags are divided into some main categories.

Basic Tags

Basic tags are tags that are essentially used in all HTML documents. These tags define the core structure of an HTML document. The list of basic tags of HTML is given below.

<html> - This tag define an HTML file. Every HTML file is started with the same tag.

<head> - In this tag, related scripts and styles are defined from the webpage.

<title> - This tag defines the title of the webpage.

<body> - The main content of the webpage is defined in this tag.

Formatting Tags

Formatting tags are tags that are used to format text. These tags only apply to text and control the presentation of text. The list of the formatting tags of HTML is given below.

<i> - Text is made to italic by this tag.

<b> - The text is bolded by this tag.

<u> - Text is underline with this tag.

<ins> - This tag defines a text that has been added to the content later.

<mark> - Text is highlighted by this tag.

<sup> - Text from this tag is defined as superscript.

<sub> - Text from this tag is defined as subscript.

<small> - This tag is defined as a small text.

<del> - Text is deleted from this tag.

<strong> - Text from this tag is used to show strong (bold).

Form and Input Tags

Form and input tags are used to create forms in the webpage and to get input from the user. Their list is being given below.

<form> - This is a container tag to create form elements.

<input> - Various form elements are created by this tag.

<textarea> - Textarea is created by this tag.

<buttons> - The buttons are created by this tag.

<select> - This is a container tag to create a dropdown list.

<optgroup> - This tag is grouped of related options in the dropdown menu.

<option> - This tag defines the options of the dropdown list.

<label> - This tag is used to define a text label.

<fieldset> - This tag creates related elements in a form

Frame Tags

Frame tags are used to divide a web page into frames. The list of these tags is being given below.

<frame> - This works the container for tag frame elements.

<frameset> - The tags are defined by this tag.

<noframes> - This tag is define content for those browsers. Which do not support forms.

<iframe> - Inline frames are defined by this tag.

Image Tags

Image tags are used to include and render images in a web page. Their list is being given below.

<img> - This tag includes image in webpage.

<map> - This tag is used to include an image map.

<area> - This tag shows a particular location in the map.

Link Tags

Link tags are used to create links in the web page. Links are used to travel from one page to another. Their list is being given below.

<a> - This tag is defined by the link in the webpage.

<link> - The HTML file is linked to the CSS file by this tag.

List Tags

List tags are used to create lists in the webpage. Their list is being given below.

<ul> - This tag creates a container for the unordered list.

<ol> - This tag creates a container for the ordered list

<li> - The list item is defined by this tag

<dl> - This tag creates a container for the definition list.

<dt> - This tag defines the term of the definition list.

<dd> - This tag defines definition list definition

Table Tags

Table tags are used to create tables in WebPages. Their list is being given below.

<table> - This tag is used to create the table.

<th> - This tag defines the heading of the table.

<tr> - The rows of the table are defined by this tag.

<td> - This tag defines the columns of the table

<thead> - This group creates a group of header content in the table.

<tbody> - This group creates a group of body content in the table.

<caption> - The title of the table is defined by this tag.

Style Tags

Styles tags are used to apply different types of styles. Their list is being given below.

<style> - This tag defines styles (CSS) for the HTML document.

Section Tags

Section tags work like a container. Their list is being given below.

<div> - This tag creates a block section.

<span> - This tag creates an inline section.

<section> - The document is divided into several sections by this tag.

Scripting Tags

Scripting tags are used to apply scripts to the webpage. Their list is being given below.

<script> - Within this tag you define the script to be used with HTML.

<noscript> - Define content for such browsers inside this tag in which the script has been disabled

Attributes are defined in HTML tags. Attributes are used to pass an additional information to an interpreter with a tag. Read HTML Attributes for detailed information about Attributes.

 


 

HTML टैग

HTML टैग का परिचय

एक HTML file tags  और text  का combination  होती है। HTML tags  को HTML elements  भी कहा जाता है। यदि आपको tags  का concept  समझ आ जाये तो आप HTML आसानी से समझ सकते है। क्योंकि HTML पूरी तरह tags के द्वारा ही कार्य करती है

शुरआत में जब HTML को design किया गया तो इसे सिर्फ WebPages में text को display करने के लिए use किया जाता था। उस समय HTML बहुत limited थी और इसमें कुछ ही tags थे। HTML tags द्वारा text को WebPages में display करने की process को text को mark करना कहा जाता था। यही वजह थी की HTML को text markup language कहा गया।

उस समय HTML सिर्फ computer scientists द्वारा use की जाती थी जो अपने papers को HTML द्वारा world wide web पर publish करते थे ताकि दूसरे scientist उन्हें पढ़ सके। लेकिन HTML इतनी simple और effective थी की यह बहुत जल्दी popular हो गयी और बहुत से लोग इसे use करने लगे।

धीरे धीरे जैसे ही HTML popular हुई तो WebPages में अलग अलग elements show करने की requirement बढ़ती गयी। अब HTML सिर्फ एक text markup language नहीं रही है। अब आप HTML के द्वारा WebPages में कई प्रकार के elements जैसे की lists, tables images, audio, video, graphics आदि insert कर सकते है।

किसी भी webpage में elements (lists, tables, images, video आदि) HTML tags द्वारा ही insert किये जाते है। आप webpage में जो भी add करना चाहे वह tags द्वारा ही add किया जाएगा। इसके लिए HTML आपको बहुत से tags provide करती है। ये सभी tags interpreter से familiar होते है।

Interpreter एक program होता है जो सभी web browsers में होता है। यह program HTML tags को identify करता है और उनके मतलब को समझकर web page में उसी के अनुरूप text, images, list और tables आदि show करता है।

Basically tags से आप interpreter को ये बताते है की आप webpage में क्या display करना चाहते है। उदाहरण के लिए यदि आप webpage में image add करना चाहते है तो इसके लिए आप  <img > tag अपनी HTML file में define करेंगे।

ज्यादातर HTML tags का purpose आप उनके नाम द्वारा ही समझ सकते है। उदाहरण के लिए  <table > tag को webpage में table insert करने के लिए use किया जाता है। जैसे जैसे आप इन्हें use करना शुरू करते है तो आपको आसानी से याद रहता है की कोई particular tag किस लिए use किया जाता है।

HTML टैग्स का सिंटेक्स

आम तौर पर HTML tag के 3 part होते है। Opening tag शुरुआत में लगाया जाता है। इससे interpreter को ये पता चल जाता है की आप क्या करने वाले है। Opening tag के बाद वो text लिखा जाता है जिस पर ये tag apply हो रहा है। इसके बाद closing tag लिखा जाता है।

Closing tag से interpreter को पता चलता है की इस tag का उपयोग यँही तक था। Closing tag को opening tag से differentiate करने के लिए closing tag में forward slash लगाया जाता है।

HTML tags का general syntax निचे दिया जा रहा है।

<tagName > text  </tagName >

सभी HTML tags ही closing tag द्वारा नहीं close किये जाते है। HTML में ऐसे tags भी है जिन्हें सिर्फ opening tag द्वारा ही define किया जाता है। ऐसे tags को empty tags कहा जाता है। इनका syntax निचे दिया जा रहा है।

 <tagName >

HTML में कुछ ऐसे tags भी है जिनके opening और closing दोनों parts एक ही part द्वारा define किये जाते है। इनमें पहले tag का नाम लिखा जाता है उसके बाद forward slash लगाया जाता है। इनका syntax निचे दिया जा रहा है।

 <tagName / >

HTML टैग के प्रकार

HTML में बहुत प्रकार के tags available है। कुछ tags text को format करने के लिए use किये जाते है तो कुछ multimedia elements जैसे की images, audio, video आदि insert करने के लिए use किये जाते है।

HTML के कुछ tags structures जैसे की tables, sections और lists आदि create करने के लिए use किये जाते है तो कुछ tags container की तरह भी काम करते है जिनके अंदर दूसरे tags को define किया जाता है जो उसके sub tags होते है।

HTML के सभी प्रकार के tags को कुछ मुख्य categories में divide करके निचे बताया जा रहा है।

Basic Tags

Basic tags वे tags होते है जो सभी HTML documents में अनिवार्य रुप से use किये जाते है। ये tags किसी HTML document के core structure को define करते है। HTML के basic tags की list निचे दी जा रही है।

<html > - यह tag एक HTML file को define करता है। हर HTML file की शुरुआत इसी tag से की जाती है।

<head > - इस tag में webpage से related scripts और styles define की जाती है।

<title > - इस tag से webpage का title define किया जाता है।

<body > - इस tag में webpage का मुख्य content define किया जाता है।

Formatting Tags

Formatting tags वे tags होते है जो text को format करने के लिए use किये जाते है। ये tags text पर ही apply होते है और text की presentation को control करते है। HTML के formatting tags की list निचे दी जा रही है।

<i > - इस tag द्वारा text को italic बनाया जाता है।

<b > - इस tag द्वारा text को bold किया जाता है।

<u > - इस tag से text को underline किया जाता है।

<ins > - इस tag द्वारा ऐसे text को define किया जाता है जो content में बाद में add किया गया है।

<mark > - इस tag द्वारा text को highlight किया जाता है।

<sup > - इस tag से text को superscript के रूप में define किया जाता है।

<sub > - इस tag से text को subscript के रूप में define किया जाता है।

<small > - इस tag से small text के रूप में define किया जाता है।

<del > - इस tag से text को deleted show किया जाता है।

 <strong > - इस tag से text को strong (bold) show किया जाता है।

Form and Input Tags

form और input tags webpage में forms create करने और user से input प्राप्त करने के लिए use किये जाते है। इनकी list निचे दी जा रही है।

<form > - यह form elements create करने के लिए एक container tag होता है।

<input > - इस tag द्वारा different form elements create किये जाते है।

<textarea > - इस tag द्वारा textarea create किया जाता है।

<button >  - इस tag द्वारा buttons create किये जाते है।

<select > - यह dropdown list create करने के लिए container tag होता है।

<optgroup > - इस tag द्वारा dropdown menu में related options का group create किया जाता है।

<option > - इस tag द्वारा dropdown list के options define किये जाते है।

<label > - यह tag एक text label define करने के लिए use किया जाता है।

<fieldset > - इस tag के द्वारा किसी form में related elements का create किया जाता है।

Frame Tags

Frame tags एक web page को frames के रूप में divide करने के लिए use किये जाते है। इन tags की list निचे दी जा रही है।

<frame > - यह tag frame elements के लिए container का कार्य करता है।

<frameset > - इस tag द्वारा frames define किये जाते है।

<noframes > - इस tag द्वारा उन browsers के लिए content define किया जाता है। जो forms को support नहीं करते है।

<iframe > - इस tag द्वारा inline frames define किये जाते है।

Image Tags

Image tags web page में images को include और render करने के लिए use किये जाते है। इनकी list निचे दी जा रही है।

<img > - इस tag द्वारा webpage में image include की जाती है।

<map > - इस tag द्वारा एक image map include किया जाता है।

<area > - इस tag द्वारा map में किसी particular location को show किया जाता है।

Link Tags

Link tags web page में links create करने के लिए use किये जाते है। Links एक page से दूसरे page तक travel करने के लिए use की जाती है। इनकी list निचे दी जा रही है।

<a > - इस tag द्वारा webpage में link define की जाती है।

<link > - इस tag द्वारा HTML file को CSS file से जोड़ा जाता है।

List Tags

List tags webpage में lists create करने के लिए use किये जाते है। इनकी list निचे दी जा रही है।

<ul > - यह tag unordered list के लिए container create करता है।

<ol > - यह tag ordered list के लिए container create करता है

<li > - इस tag द्वारा list item define किये जाते है

<dl > - ये tag definition list के लिए container create करता है।

<dt >इस tag द्वारा definition list की term define की जाती है।

<dd > - इस tag द्वारा definition list की definition define की जाती है

Table Tags

Table tags WebPages में tables create करने के लिए use किये जाते है। इनकी list निचे दी जा रही है।

<table > - यह tag table create करने के लिए use किया जाता है।

<th > - इस tag द्वारा table की heading define की जाती है।

<tr > - इस tag द्वारा table की rows define की जाती है।

<td > - इस tag द्वारा table के columns define किये जाते है

<thead > - यह tag table के header content का group create करता है।

<tbody > - यह tag table के body content का group create करता है।

<caption > - इस tag द्वारा table का शीर्षक define किया जाता है।

Style Tags

Styles tags विभिन्न प्रकार की styles apply करने के लिए use किये जाते है। इनकी list निचे दी जा रही है।

<style > - इस tag के अंदर HTML document के लिए styles (CSS) define की जाती है।

Section Tags

Section tags किसी container की तरह काम करते है। इनकी list निचे दी जा रही है।

<div > - यह tag एक block section create करता है।

<span > - यह tag एक inline section create करता है।

<section > - इस tag द्वारा document को कई sections में divide किया जाता है।

Scripting Tags

Scripting tags webpage में scripts apply करने के लिए use किये जाते है। इनकी list निचे दी जा रही है।

<script > - इस tag के अंदर आप HTML के साथ use की जाने वाली script को define करते है।

<noscript > - इस tag के अंदर ऐसे browsers के लिए content define करते है जिनमें script को disable कर दिया गया है

HTML tags के अंदर attributes define किये जाते है। Attributes किसी tag के साथ interpreter को additional information pass करने के लिए use किये जाते है। Attributes के बारे में विस्तृत जानकारी के लिए HTML Attributes  पढ़े।

Comments


ravi ( Date :12 Feb,2018) :
Good Tutorial kyuki ye hindi or english dono me h